`
小鑫的java
  • 浏览: 143721 次
  • 性别: Icon_minigender_1
  • 来自: 浙江
社区版块
存档分类
最新评论

HTML_上课代码

阅读更多
开始的这段很有用
<html>
<head><title>注册页面</title>
        <script language="javascript" type="text/javascript">
            function showExtends(){
                var table = document.getElementById("extends");
                var display = table.style.display;
                if( display == 'none') {
                    table.style.display = 'block';
                }else if( display == 'block') {
                    table.style.display = 'none';
                }
            }

            function init() {
                var user = document.getElementById("username");
                user.focus();
            }
        </script>
</head>
<body onload="init()">
<h1 align="center">注册页面</h1>
<hr>
<form  action="">
<table align="center" border="1" width="700" height="160">
<tr>
    <td colspan="2"  align="center"><i><b>注册信息</b></i></td></tr>
<tr>
    <td width="250">用户名:</td>
        <td><input id="username" type="text" name="username"/></td>
</tr>
<tr>
    <td >密码:</td>
        <td><input type="password" name="pwd"/></td>
</tr>
<tr>
        <td >确认密码:</td>
        <td><input type="passeord" name="surepwd"/></td>
</tr>
<tr>
         <td >高级选项:</td>
        <td><input type="checkbox" name="gaoji" value="xuanxiang" onclick="showExtends()"/>显示用户扩展信息设置选项</td>
</tr>
</form>
</table>
<hr>
<form  action="">
<table id="extends" align="center" border="1" width="700" height="300" style="display:none">
<tr>
    <td colspan="2"  align="center"><i><b>扩展信息</b></i></td></tr>
<tr>
    <td width="250">安全问题:</td>
        <td><select name="anquan">
            <option value="wu">无安全问题
            <option value="anquan1">你的名字
            <option value="anquan2">你的年龄
            </select>
        </td>
</tr>
<tr>
    <td >回答:</td>
        <td><input type="text" name="answer"/></td>
</tr>
<tr>
        <td >性别:</td>
        <td>男<input type="radio" name="gender" value="male" checked/>
        女<input type="radio" name="gender" value="female" /></td>
</tr>
<tr>
         <td >生日:</td>
        <td><input type="text" name="answer" value="YYYY-MM-DD" onfocus="this.value=''"/></td>
</tr>
<tr>
         <td >爱好:</td>
        <td>
    <input type="checkbox" name="hubby" value="shangwang"/>上网
    <input type="checkbox" name="hubby" value="liaotian"/>聊天
    <input type="checkbox" name="hubby" value="xuexi"/>学习<br>
    <input type="checkbox" name="hubby" value="youxi"/>游戏
    <input type="checkbox" name="hubby" value="lanqiu"/>篮球
    <input type="checkbox" name="hubby" value="football"/>足球
    </td>
</tr>
<tr>
         <td >个人介绍:</td>
        <td>
    <textarea name="resume" cols="40" rows="3"></textarea>
    </td>
</tr>
<tr>
         <td colspan="2"  align="center">
    <input type="submit" name="submit1" value="提交"/>
    <input type="submit" name="reset1" value="重置"/></td>
        
</tr>
</form>
</body>
</html> 

*************************************************************************
<html> 
<head>
<title>网页1</title>
</head>

<body bgcolor="pink">
<h1 align="center">biaoti</h1>
<h3>biaoti</h3>
<h6>biaoti</h6>
<hr>
<p>fadfad<br>fsafsa</p>

<i>任松鑫</i><br>
<big>任松鑫</big><br>
<small>任松鑫</small><br>
<em>任松鑫</em><br>
X<sup>n</sup><br>
X<sub>n</sub><br>

<del>删除文字</del><br>
<strike>删除文字</strike><br>
<ins>插入文字</ins><br>
<blink>闪动文字</blink><br>
<tt>打印机文字</tt><br>
<pre>
123
 123
  123
   123
</pre>

<ul type="disc">
<li><blink>牛奶</blink></li>
<ul type="square">
<li>牛奶1</li>
<li>牛奶2</li>
<li>牛奶3</li>
</ul>
<li>咖啡</li>
<li>茶</li>
</ul>

<ol type="A">
<li>星期一</li>
<ol type="a">
<li>上午</li>
<li>中午</li>
<li>下午</li>
</ol>
<li>&nbsp;&nbsp;星期二</li>
<li>星期三</li>
<li>星期四</li>
<li>星期五</li>
</ol>

<p>&amp; &reg; &copy;&yen;</p>
<!--
HTML特殊字符显示HTML字符实体(Character Entities)

< 小于 &lt; &#60;
> 大于 &gt; &#62;
& &符号 &amp; &#38;
" 双引号 &quot; &#34;

其他常用的字符实体(Character Entities)
显示结果 说明 Entity Name Entity Number
版权 &copy; &#169;
注册商标 &reg; &#174;
× 乘号 &times; &#215;
÷ 除号 &divide; &#247;

-->

任松鑫<p>任松鑫</p>任松鑫<br>
任松鑫1<div>任松鑫1</div>任松鑫1<br>
任松鑫2<span>任松鑫2</span>任松鑫2

<br>
<a href="http://www.sina.com.cn">新浪</a><br>
<a href="1.html">1html</a>

<h2 align="center"><a name="top">目录</h2>
<h3 align="center"><a href="#c1">第一章</a></h3>
<h3 align="center"><a href="#c2">第二章</a></h3>
<h3 align="center"><a href="#c3">第三章</a></h3>
<pre>


</pre>
<h3 align="center"><a name="c1">第一章</a></h3>
<pre>
第一章
第一章
第一章
第一章
第一章
第一章
第一章
第一章
第一章
第一章
第一章
第一章

</pre>
<center><a href="#top">返回目录</a></center>

<h3 align="center"><a name="c2">第2章</a></h3>
<pre>
第一章
第一章
第一章
第一章
第一章
第一章
第一章
第一章
第一章

</pre>
<a href="#top">返回目录</a>

<h3 align="center"><a name="c3">第3章</a></h3>
<pre>
第一章
第一章
第一章
第一章
第一章
第一章
第一章
第一章
第一章

</pre>
<a href="#top">返回目录</a>

<table border="1" width="300" height="200" bgcolor="green" cellspacing="30" cellpadding="10">
<caption>表格</caption>
<tr><td>100</td><td>200</td><td>300</td></tr>
<tr><td>400</td><td>500</td><td>600</td></tr>
</table>

<table  align="center" width="60%" height="40%" bgcolor="black" cellspacing="2">
<caption>中式表格</caption>
<tr bgcolor="white" align="center"><td>100</td><td>200</td><td>300</td></tr>
<tr bgcolor="white" align="center"><td>400</td><td>500</td><td>600</td></tr>
</table>

<table  align="center" width="60%" height="40%" bgcolor="red" cellspacing="2">
<caption>合并表格</caption>
<tr bgcolor="white" align="center"><td colspan="2">100</td><td rowspan="2">300</td></tr>
<tr bgcolor="white" align="center"><td>400</td><td>500</td></tr>
</table>

<table height="8%"><tr></tr></table>

<table  align="center" width="70%" height="50" bgcolor="black" cellspacing="0">
<tr bgcolor="white" align="center">
<td rowspan="2"><font color="pink">E-mart</font></td>
<td><a href="">书籍</a></td>
<td><a href="">DVD</a></td>
<td><a href="">服装</a></td>
<td><a href="">户外</a></td>
<td><a href="">装饰</a></td>
</tr>
<tr bgcolor="white" align="center">
<td><a href="">体育</a></td>
<td><a href="">女生</a></td>
<td><a href="">男生</a></td>
<td><a href="">知识</a></td>
<td><a href="">旅游</a></td>
</tr>
</table>


<form action="http://www.sina.com.cn">
    姓名:<input type="text" name="username"/>
    <br>
    <input type="submit"/>
</form>

<table align="center" bgcolor="yellow">
<form action="">
    <tr >
        <td colspan="2" align="center">注册信息</td>
    </tr>
    <tr>
        <td >姓名:</td>
        <td><input type="text" name="username"/></td>
    </tr>
    <tr>
        <td >密码:</td>
        <td><input type="password" name="pwd"/></td>
    </tr>
    <tr>
        <td >性别:</td>
        <td>男<input type="radio" name="gender" value="male" checked/>
        女<input type="radio" name="gender" value="female" /></td>
    </tr>
    <tr>
        <td>学历</td>
        <td><select name="xueli">
            <option value="gaozhong">高中
            <option value="dazhuan">大专
            <option value="benke">本科
            </select>
        </td>
    </tr>
    <tr>
        <td>爱好</td>
        <td>
            游泳<input type="checkbox" name="hubby" value="swimming"/>
            旅游<input type="checkbox" name="hubby" value="travel"/>
            足球<input type="checkbox" name="hubby" value="football"/>
        </td>
    </tr>
    <tr>
        <td>简历:</td>        
        <td>
            <textarea name="resume" cols="10" rows="3"></textarea>
        </td>
    </tr>
    <tr>
        <td colspan="2" align="center"><input type="submit"/></td>
    </tr>
</form>
</table>


</body>
</html> 

******************************************************************
<html>
<head>
<link rel="stylesheet" type="text/css" href="css2.css"></link>
<title>css</title>
<style>
    h1{color:red}
    h2,h4{color:green}
    h3{color:pink}
    p.class1{color:blue}
    p.class2{color:yellow}
     .class3{color:#9900FF;font-size:30;background-color:yellow}
</style>
</head>
<body>
    <h1>h1</h1>
    <h2>h2</h2>
    <!--style 影响范围最小 优先级最高 -->
    <h2 style="color:red">h2</h2>
    <h3>h3</h3>
    <h4>h4</h4>
    <h4 class="class3">h4</h4>
    <p class="class4">123456789</p>
    <p class="class1">123456789</p>
    <p class="class2">123456789</p>
</body>
</html>

<!--
css2.css文件  影响范围最大 优先级最低
.class3{color:red;font-size:20} 
.class4{color:blue;font-size:50} 
-->

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics