【移動(dòng)應(yīng)用開發(fā)技術(shù)】Html5Css初學(xué)總結(jié)_第1頁
【移動(dòng)應(yīng)用開發(fā)技術(shù)】Html5Css初學(xué)總結(jié)_第2頁
【移動(dòng)應(yīng)用開發(fā)技術(shù)】Html5Css初學(xué)總結(jié)_第3頁
【移動(dòng)應(yīng)用開發(fā)技術(shù)】Html5Css初學(xué)總結(jié)_第4頁
【移動(dòng)應(yīng)用開發(fā)技術(shù)】Html5Css初學(xué)總結(jié)_第5頁
免費(fèi)預(yù)覽已結(jié)束，剩余2頁可下載查看

下載本文檔

版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

【移動(dòng)應(yīng)用開發(fā)技術(shù)】Html5，Css初學(xué)總結(jié)

HTML一、通用模板：<!DOCTYPEhtml><htmllang=”en”>

<head>

<meta

charset=”UTF-8”/>

<title>文檔標(biāo)題</title>

<link

rel="shortcuticon"

href="img\wujiaoxing.ico"/>

<!--設(shè)置標(biāo)簽頁圖標(biāo)-->

<link

rel=”stylesheet”

href=”url”/>

<!--外接樣式表-->

</head>

<body>

<header

role=”banner”>

<nav

role=”navigation”>頁眉

</nav></header>

<main

role=”main”>

<article>

<section><p>主要內(nèi)容</p>

</section></article>

</main>

<aside

role=”complementary”>附注欄的其他內(nèi)容</aside>

<footer

role=”contentinfo”>頁腳（如：版權(quán)）</footer>

</body></html>二、網(wǎng)頁三要素：

1.

元素標(biāo)簽：（1）

同行顯示：

<a>(鏈接標(biāo)簽)</a>

<em>（斜體標(biāo)簽）</em>

<strong>(粗體標(biāo)簽)</strong>

<code>標(biāo)記代碼</code>（2）

換行顯示：

1.

<h2>(標(biāo)題1標(biāo)簽)</h2>

2.

<h3>(標(biāo)題2標(biāo)簽)</h3>

3.

<article>(文章標(biāo)簽)</article>

4.

<p>(段落標(biāo)簽)</p>

5.<main></main>注:一個(gè)頁面最多使用一次！不能放置header;footer;aside;article中

6.

<header></header>

7.

<footer></footer>

8.

<hr>(分隔線標(biāo)簽)</hr>

9.

<div>容器標(biāo)簽換行是

<div>固有的唯一格式表現(xiàn)</div>

10.

<section>區(qū)塊

</section>（3）

未知：

1.<img>(圖像標(biāo)簽)</img>

2.<font>(字體標(biāo)簽)</font>

3.<b>(粗體標(biāo)簽)</b>

4.<i>(斜體標(biāo)簽)</i>

5.<u>(下劃線標(biāo)簽)</u>

6.<sup>(上標(biāo)標(biāo)簽)</sup>

7.<sub>(下標(biāo)標(biāo)簽)</sub>

8．<audio>

</audio>

9.<video>

</video>

10.<li>列表</li>

11.<oltype=”a”start=”3”>

<li>有序列表</li>

<li>有序列表</li>

<li>有序列表</li>

</ol>

12.<ultype=”disc/circle/square”><li>無序列表</li><li>無序列表</li><li>無序列表</li>

</ul>13．<ins>添加內(nèi)容(表現(xiàn)為加下劃線)</ins>14.<del>刪除內(nèi)容（表現(xiàn)為加刪除線）</del>15.<cite>標(biāo)簽通常表示它所包含的文本對(duì)某個(gè)參考文獻(xiàn)的引用，比如書籍或者雜志的標(biāo)題。按照慣例，引用的文本將以斜體顯示。</cite>16.

<figure>標(biāo)簽規(guī)定獨(dú)立的流內(nèi)容（圖像、圖表、照片、代碼等等）。</figure>2.

屬性:

<a>:href;title;

<img>:src;width;height;alt

3.

值：

三、其他：

4.

注釋：

如：<!--

我是被注釋內(nèi)容，并且在瀏覽器中不會(huì)顯示

-->

5.學(xué)習(xí)相關(guān)鏈接：

網(wǎng)頁轉(zhuǎn)義符號(hào)HTML代碼大全：/web-d/archive/2010/04/16/1713298.html

HTML系列教程：/h.asp

各類標(biāo)簽及其用法：/tags/tag_doctype.asp

6．鏈接錨鏈接：鏈接到某一頁面的特定區(qū)域。

CSS

模板：Selector(選擇器){

Attribute(屬性):value(值);

}

//

各種元素。

Color：#000000(黑色)/#ffffff(白色)

注：?jiǎn)涡睏U表示或者！1.鏈接樣式：

a:link{

color:blue;

}

/*鏈接激活前的外觀*/

a:hover{

color:orange;}

/*鼠標(biāo)指向鏈接時(shí)的外觀*/

a:hover{

color:red;}

/*激活鏈接后的外觀*/

2.文本樣式：

字體：

font-family:Geneva,Tahoma,sans-serif;

/*字體類型,三選一*/

font-style:italic/normal;

/*斜體和正體二選一*/

font-weight:bolder/bold/normal/lighter;

*更粗/正常/更細(xì)/三選一*/

font-size:16px/1em;

/*字體大小，默認(rèn)1em=16px*/

line-height:16px

/*行高*/

字間距：word-space:length(4px或其他);

字偶距:

letter-space:length(4px或其他);

添加縮進(jìn)：text-indent:length(2em或其他);

對(duì)齊文本：text-align:left/right/center/justify（兩端對(duì)齊）;

修改文本大小寫:text-transform:uppercase(大)/lowercase(小)/none;

裝飾文本：：text-decoration:underline/overline/through/none;

(下劃線/上劃線/刪除線/無)

3.元素顯示方式：display:block/inline/;

(換行/行內(nèi)顯示)

4.元素可見性：visibility:visible/hidden;

5.邊框：border-style:dashed/solid/dotted

;

(虛線/實(shí)線/點(diǎn)劃線)border-width:border-color:border:2pxsolidred;border-radius:length;

//邊框圓角半徑

6.外/內(nèi)邊距：margin-top/-bottom:length;

Padding：length;

Padding-top/bottom/left/right:length;

7.元素浮動(dòng)：float:left/right/none;

8.清除浮動(dòng)：clear:left/right;

9.處理溢出：overflow:visible/hidden/scroll/auto;

10.修改指針形狀：cursor:pointer/default/crosshair/move/wait/help;

11.列表標(biāo)記：

list-style-type:disc/circle/square….;

/*

disc:圓點(diǎn)；circle：圓圈；square：方塊；decimal：數(shù)字；

upper-alpha：大寫字母。

*/

12.有序列表：

<olstart=”2”>從2開始編號(hào)</ol>

List-style-position:inside/outside;

13.fieldset(表單):

表單字段(type屬性值)：text/email/password/url/submit/radio(單)/checkbook（復(fù)選）

<inputtype=”text”placeholder=”提示信息”>

單選框：

<p>

<inputtype="radio"id="tankzx"name="school"value="T"/>

<labelfor="tankzx">tk</label>

</p>

復(fù)選框:

<p>

<inputtype="checkbox"id="tank"name="學(xué)校"value="TZ"/>

<labelfor="tank">tk</label>

</p>

列表框：

<p>

<labelfor="state">State（國家）：</label>

<selectid="state"name="state"size=””>

<optgrouplabel=”xx”>

/*分組列表*/

<optionvalue="ch">China</option>

<optionvalue="usa">American</option>

</optgroup>

<optionvalue="en">England<option>

</select>

</p>

14.表格:

<table>

<tr>

//行標(biāo)記

<th></th>

//表頭標(biāo)記

<td></td>

//單元格標(biāo)記

</tr>

<tr>

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

最新文檔

評(píng)論

0/150

提交評(píng)論