附上文檔結(jié)構(gòu)圖袱吆，方便復(fù)習(xí)
傳送門 - html就是描述語義的歌径，啥也不是
Paste_Image.png
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
<style type="text/css">
body{
font-family: "Microsoft YaHei";
font: 14px;
}
.header{
width: 100%;
height: 60px;
background-color: #898989;
}
.header .logo{
float: left;
width: 20%;
height: 60px;
background-color: yellow;
}
.header .nav{
float: left;
width: 80%;
height: 60px;
background-color: red;
}
.banner{
width: 100%;
height: 400px;
background-color: orange;
}
.info{
width: 100%;
height: 100px;
background-color: skyblue;
}
.footer{
width: 100%;
height: 50px;
background-color: black;
color: white;
}
</style>
</head>
<body>
<h3>無序列表</h3>
<ul>
<li>北京</li>
<li>上海</li>
<li>深圳</li>
</ul>
<h3>li 是一個容器標簽</h3>
<ul>
<li>
<h3>第一本書</h3>
<p>30￥</p>
<p>這本書是一本好書啊哈哈哈哈</p>
</li>
<li>
<h3>第二本書</h3>
<p>30￥</p>
<p>這也是一本好書哈哈哈</p>
</li>
<li>
<h3>第三本書</h3>
<p>40￥</p>
<p>這是一本好叔叔菽粟衣迷，哈哈哦好啊仍律，就是有點貴Ｏ九亍０怠副硅！</p>
</li>
</ul>
<h3>多級列表</h3>
<ul>
<li>
吃的
<ul>
<li>餅干</li>
<li>面包</li>
<li>
巧克力
<ul>
<li>德芙</li>
<li>費列羅</li>
</ul>
</li>
</ul>
</li>
</ul>
<h3>定義列表</h3>
<dl>
<dt>數(shù)學(xué)與計算機學(xué)院</dt>
<dd>數(shù)學(xué)與計算機學(xué)院是我們學(xué)校就業(yè)薪資最高的學(xué)院</dd>
</dl>
<dl>
<dt>機械學(xué)院</dt>
<dd>妹子太少了则剃，不去１Ю洹！扯旷！</dd>
</dl>
<dl>
<dt>服裝與設(shè)計學(xué)院</dt>
<dd>美女多，哈哈->_->!!!</dd>
</dl>
<h3>div使用快劃分</h3>
<div>
<h3>武漢主要高校</h3>
<ul>
<li>華中科技大學(xué)</li>
<li>華中師范大學(xué)</li>
<li>武漢紡織大學(xué)</li>
</ul>
</div>
<div>
<h3>北京主要高校</h3>
<ul>
<li>清華大學(xué)</li>
<li>北京大學(xué)</li>
<li>中國人民大學(xué)</li>
</ul>
</div>
<h3>span小區(qū)域劃分</h3>
<ul>
<li>
<p>iphone9</p>
<p>iphone9怎么怎么好好怎么好培己，還是怎么怎么好<span><a href="">詳細信息</a><a href="">加入購物車</a></span></p>
</li>
<li>
<p>iphone9</p>
<p>iphone9怎么怎么好好怎么好碳蛋，還是怎么怎么好<span><a href="">詳細信息</a><a href="">加入購物車</a></span></p>
</li>
<li>
<p>iphone9</p>
<p>iphone9怎么怎么好好怎么好，還是怎么怎么好<span><a href="">詳細信息</a><a href="">加入購物車</a></span></p>
</li>
</ul>
<h3>div主要負責(zé)布局</h3>
<div class="header">
<div class="logo">這是logo</div>
<div class="nav">這是導(dǎo)航欄</div>
</div>
<div class="content">
<div class="banner">這是巨幕</div>
<div class="info">這是基本信息</div>
</div>
<div class="footer">這是頁腳</div>
<div>
<h3>這是表單的使用</h3>
<form action="">
<p>
姓名:
<input type="text" value="張三" />
</p>
<p>
密碼：
<input type="password" value="123456"/>
</p>
<p>
性別：
<input type="radio" name="sex" /> 男
<input type="radio" name="sex" /> 女
<input type="radio" name="sex" /> 你猜省咨？
</p>
<p>
學(xué)歷：
<input type="radio" name="xueli" /> 初中
<input type="radio" name="xueli" /> 高中
<input type="radio" name="xueli" checked="checked" /> 本科
<input type="radio" name="xueli" /> 碩士
<input type="radio" name="xueli" /> 博士
</p>
<p>
愛好：
<input type="checkbox" name="aihao"/> 足球
<input type="checkbox" name="aihao" checked="checked" /> 籃球
<input type="checkbox" name="aihao"/> 乒乓球
</p>
<p>
技能：
<input type="checkbox" name="jineng" checked="checked" /> HTML
<input type="checkbox" name="jineng" /> CSS
<input type="checkbox" name="jineng" /> JS
</p>
<p>
籍貫：
<select>
<option>北京</option>
<option>上海</option>
<option>杭州</option>
</select>
</p>
<p>
個人介紹：
<textarea rows="4" cols="80"></textarea>
</p>
<p>
普通按鈕：
<input type="button" value="我是一個普通按鈕" />
</p>
<p>
提交按鈕：
<input type="submit" />
</p>
<p>
重置按鈕
<input type="reset" />
</p>
</form>
</div>
<div>
<h3>表單詳細解釋</h3>
<div>
<span>input type="text" value="這里是默認值"</span>
<p>
input的type類型有很多肃弟，如：</br>
button :表示按鈕 </br>
checkbox ：表示復(fù)選框</br>
file ：文件</br>
hidden ：隱藏屬性</br>
image ：圖片</br>
password ：密碼</br>
radio ：單選按鈕</br>
reset ：重置</br>
submit ：提交</br>
text ：文本</br>
注：要學(xué)會自己查看W3C在線手冊，多練習(xí)Ａ闳亍ｓ允堋！５蟹洹箩兽！
</p>
</div>
</div>
<div>
<h3>字符實體的使用</h3>
<p><'& lt ;表示< lt：less than的意思，就是小于'</p>
<p>>'& gt ;表示>' gt:great than的意思紊册，就是大于</p>
<p>?'& copy ;'表示版權(quán)所有信息</p>
</div>
</body>
</html>
