列表
有序、無序和定義列表
無序列表
無序列表是一個項目的列表,此列項目使用粗體圓點(典型的小黑圓圈)進行標(biāo)記。開始于<ul></ul>標(biāo)簽,列表項為<li></li>
<ul>
<li>Wonder</li>
<li>maomao</li>
</ul>
- Wonder
- maomao
有序列表
開始于<ol></ol>標(biāo)簽,列表項為<li></li>
<ol>
<li>Wonder</li>
<li>maoamo</li>
</ol>
- Wonder
- maoamo
定義列表
自定義列表不僅僅是一列項目,而是項目及其注釋的組合。
自定義列表以<dl></dl>標(biāo)簽開始。每個自定義列表項以<dt></dt>開始。每個自定義列表項的定義以<dd></dd>開始。
<dl>
<dt>Wonder</dt>
<dd>奇跡</dd>
<dt>maomao</dt>
<dd>茂茂</dd>
</dl>
Wonder奇跡maomao茂茂
塊元素
塊級元素在瀏覽器顯示時,通常會以新行來開始(和結(jié)束)
例如:<h1>,<p>,<ul>,<table>,<div>
內(nèi)聯(lián)元素
內(nèi)聯(lián)元素在顯示時通常不會以新行開始
例如:<b>,<td>,<a>,<img>,<span>
網(wǎng)站布局
HTML5? ? ? ? ? 語義元素
header? ? ? ? ? 定義文檔或節(jié)的頁眉
nav? ? ? ? ? ? ? ? 定義導(dǎo)航鏈接的容器
section? ? ? ? ? 定義文檔中的節(jié)
article? ? ? ? ? ? 定義獨立的自包含文章
aside? ? ? ? ? ? ? 定義內(nèi)容之外的內(nèi)容(比如側(cè)欄)
footer? ? ? ? ? ? ? 定義文檔或節(jié)的頁腳
details? ? ? ? ? ? ? 定義額外的細節(jié)
summary? ? ? ? ? 定義 details 元素的標(biāo)題
實例
<!DOCTYPE html>
<html>
<head>
<style>
#header{
background-color:black;
color:white;
text-align:center;
padding:5px;
}
nav{
line-height:30px;
background-color:#eeeeee;
height:800px;width:100px;float:left;padding:5px;
}
section{
width:350px;float:left;padding:10px;
}
footer{
background-color:black;
color:white;
clear:both;
text-align:center;
padding:5px;
}
</style>
</head>
<body>
<div id="header">
<h1>茂茂專屬</h1>
</div>
<nav>
前端學(xué)習(xí)<br>
愛好<br>
游戲<br>
</nav>
<section>
<h1>前端學(xué)習(xí)</h1>
<h3> HTML階段 </h3>
<p>
HTML文檔結(jié)構(gòu)——段落標(biāo)簽——文字標(biāo)簽——圖片標(biāo)簽——超鏈接標(biāo)簽——列表標(biāo)簽——表格標(biāo)簽——表單標(biāo)簽——框架標(biāo)簽——HTML5新增標(biāo)簽和屬性(表單標(biāo)簽——canvas標(biāo)簽——媒體標(biāo)簽)
</p>
<h3> CSS階段 </h3>
<p> CSS語法——CSS選擇器(ID選擇器——類選擇器——符合選擇器)——CSSS樣式(背景——文本——字體——鏈接——列表——表格)——盒子模型(邊框——外邊框——內(nèi)邊框)——CSS定位(相對定位——絕對定位——浮動)——CSS3新增屬性——CSS布局實戰(zhàn) </p>
<h3> JavaScript階段 </h3>
<p> 基本語法——變量——數(shù)據(jù)類型——函數(shù)——運算符——流程控制——JS對象(String對象——Array對象——Date對象——Window對象——Document對象)——DOM操作——JS和CSS綜合操作 </p>
</section>
<footer>
http://m.wondermaomao.faisco.cn/manage/mobiDesign.jsp
</footer>
</body>
</html>
#header{background-color:black;color:white;text-align:center;padding:5px;}nav{line-height:30px;background-color:#eeeeee;height:800px;width:100px;float:left;padding:5px;}section{width:350px;float:left;padding:10px;}footer{background-color:black;color:white;clear:both;text-align:center;padding:5px;}
前端學(xué)習(xí)茂茂專屬
愛好
游戲前端學(xué)習(xí)
HTML階段
HTML文檔結(jié)構(gòu)——段落標(biāo)簽——文字標(biāo)簽——圖片標(biāo)簽——超鏈接標(biāo)簽——列表標(biāo)簽——表格標(biāo)簽——表單標(biāo)簽——框架標(biāo)簽——HTML5新增標(biāo)簽和屬性(表單標(biāo)簽——canvas標(biāo)簽——媒體標(biāo)簽)
CSS階段
CSS語法——CSS選擇器(ID選擇器——類選擇器——符合選擇器)——CSSS樣式(背景——文本——字體——鏈接——列表——表格)——盒子模型(邊框——外邊框——內(nèi)邊框)——CSS定位(相對定位——絕對定位——浮動)——CSS3新增屬性——CSS布局實戰(zhàn)
JavaScript階段
基本語法——變量——數(shù)據(jù)類型——函數(shù)——運算符——流程控制——JS對象(String對象——Array對象——Date對象——Window對象——Document對象)——DOM操作——JS和CSS綜合操作
http://m.wondermaomao.faisco.cn/manage/mobiDesign.jsp