摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>html学习总结</title> <link rel=&
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>html学习总结</title>
<link rel="shortcut icon" type="image/x-icon" href="../xuexi/static/images/08131844.jpg"/>
<link rel="stylesheet" type="text/css" href="../xuexi/static/css/css.css"/>
<style type="text/css">
body{
width: 980px;
height:auto;
background-color: aqua;
}
#div1{
border: 1px solid red;
}
h1{
text-align:center;
}
p{
text-indent:2em;
}
.div2{
background-color: chocolate;
margin-top: 10px;
width: 500px;
height: auto;
}
ul{
list-style:none;
}
ul li:before{
content:url("../xuexi/static/images/100.jpg"); margin-right:30px;
}
ul li:after{content:url("../xuexi/static/images/100.jpg");}
li ins{
text-decoration:none;
}
a{
text-decoration: none;
color: black;
}
a:hover{
color: brown;
text-decoration: underline;
font-weight:bold;
font-size:25px;
}
.div3{
background-color:darkseagreen;
margin-top: 10px;
width: 500px;
height: 800px;
text-align: center;
}
input{
margin: 5px;
height: 30px;
line-height:30px
}
input:hover{
background-color: aqua;
}
button{
height: 30px;
background-color: chocolate;
border: none;
line-height:30px;
}
.div4{
background-color:darkkhaki;
margin-top: 10px;
width: 500px;
height: 800px;
}
table{width:400px; border:1px solid red; border-collapse:collapse; text-align: center;}
tr th{height:20px;border:1px solid red; background-color: royalblue;}
tr td{height:20px;border:1px solid red;}
tr td:hover{
background-color:sandybrown;
font-size: 30px;
color:red;
}
</style>
</head>
<body>
<a href="top">页面顶部</a>
<div id=div1>
<h1>国学鉴赏</h1>
<p>一般来说<em>“国学”</em>又称“汉学”或“中国学”，泛指传统的中华文化与学术。国学包括中国古代的哲学、史学、宗教学、
文学、礼俗学、考据学、伦理学以及中医学、农学、术数、地理、政治、经济及书画、音乐、建筑等诸多方面。
现“国学”概念产生于二十世纪二十年代，当时 “西学东渐”改良之风正值炽热，张之洞、魏源等人为了与西学相对，
提出“中学”（中国之学）这一概念，并主张 “中学为体，西学为用”，一方面学习西方文明，同时又恢复两汉经学。
</p>
<pre>
何谓国学?这个词的涵义有不同的解读，
社会上尚未有统一的认识。有学者认为国学无论是古代的还是现代的，凡是中国的文化学术都属于国学;亦有学者
认为国学是专对治国理政而言的，国学特指“治国理政”之学。但无论怎样，
有两点是可以确定的：
</pre>
</div>
<div class="div2">
<h3 style="color:darkred">有序列表</h3>
<ol>
<li>电脑</li>
<li>手机</li>
<li>衣服</li>
</ol>
<h3>无序列表</h3>
<ul>
<li>电脑</li>
<ul>
<li>键盘</li>
<ul>
<li>原价<del>299.00</del>现价<ins>199.00</ins></li>
<li>原价<del>299.00</del>现价<span>199.00</span></li></li>
</ul>
<li>鼠标</li>
<li>主机</li>
</ul>
<li>手机</li>
<li>衣服</li>
</ul>
<hr>
<a href="http://www.php.cn" target="blank">php中文网</a>
<br><br>
<a href="http:www.tianmao.com"><img src="../xuexi/static/images/08131844.jpg" width="50px " title="点击进入天猫商城" alt="天猫"></a>
</div>
<div class="div3">
<h3>会员注册</h3>
<form method="GET" action="">
用户名：    <input type="text" name="username"size="30" autofocus="autofocus" placeholder="请输入姓名">
<br>
密     码：  <input type="password" name="pwd" placeholder="请输入密码" size="30">
<br>
确认密码：<input type="password" name="pwd" placeholder="请输入密码" size="30"><br>
<button>提交按钮按钮</button>
<input name="提交按钮名称" type="submit" value="提交"/>
<input type="reset" value="重置按钮"/> <br/>
</form>
</div>
<div class="div4">
<h3> 表格标签</h3>
<table>
<tr>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
<tr>
<td colspan="2">小张</td>
<td >18</td>
</tr>
<tr>
<td>小李</td>
<td>女</td>
<td rowspan="2">19</td>
</tr>
<tr>
<td>小王</td>
<td>男</td>
</tr>
</table>
</div>
<a href="" name="top">回到顶部</a>
<a href="" id="top">回到顶部</a> <!--input 文本框有焦点，返回值到不了顶部-，取消后可以到达顶部位置-->
</body>
</html>
批改老师：韦小宝批改时间：2019-01-20 09:17:23
老师总结：写的很不错 前段没有什么比较复杂的 只要用心多练习 很快就可以掌握了
