網(wǎng)頁設(shè)計自總結(jié)文檔_第1頁
網(wǎng)頁設(shè)計自總結(jié)文檔_第2頁
網(wǎng)頁設(shè)計自總結(jié)文檔_第3頁
網(wǎng)頁設(shè)計自總結(jié)文檔_第4頁
網(wǎng)頁設(shè)計自總結(jié)文檔_第5頁
已閱讀5頁,還剩8頁未讀 繼續(xù)免費閱讀

下載本文檔

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

文檔簡介

一般屬性class屬性--用于鏈接一個樣式與HTML元素示例<divclass="dreamdu1">連接div標(biāo)簽與dreamdu1樣式<div><divclass="dreamdu12pxdreamdublackdreamdubold">使用空格分開多個樣式連接div標(biāo)簽<div>div.dreamdu12px{font-size:12px;}div.dreamdublack{color:black;}div.dreamdubold{font-weight:bold;}id屬性--用于唯一標(biāo)識一個元素你可能有以下幾種原因使用到id屬性你想鏈接到一個頁面的指定位置.你要在某個HTML元素上使用特定的css樣式.你要為每個HTML元素使用script(比如javascript)你要區(qū)分兩個相同的HTML元素.示例<divid="dreamdu1">使用dreamdu1和dreamdu2來區(qū)分兩個div標(biāo)簽<div><divid="dreamdu2">使用dreamdu1和dreamdu2來區(qū)分兩個div標(biāo)簽<div>說明與id屬性相同的屬性是name,此屬性可以使用在HTML4的文檔中,新的web標(biāo)準(zhǔn)已經(jīng)拋棄了此屬性.id屬性在整個頁面與CSS樣式表中一定要是唯一的,在整個網(wǎng)站中最好也是唯一的.title屬性--為鏈接、圖像、表單等HTML元素提供描述性的信息示例<ahref="/xhtml/"title="HTML與XHTML入門教程">XHTML學(xué)習(xí)</a><imgsrc="/images/javascript_alert.png"alt="alert對話框"title="alert對話框圖示"/>說明通常用于為圖像、鏈接或按鈕增加描述性的文字,提供額外的信息(HTML中的多數(shù)標(biāo)簽都具有title屬性),比如可以通過title屬性詳細(xì)介紹要鏈接到的頁面的內(nèi)容title屬性可以使用在除了base、basefont、head、html、meta、param、script、title之外的所有標(biāo)簽中當(dāng)為HTML標(biāo)簽定義title屬性時,多數(shù)瀏覽器會將title屬性的值作為懸浮的提示信息顯示。一些可以發(fā)音的瀏覽器,甚至可以說出"title"里的內(nèi)容title屬性并不是必須的,只是為標(biāo)簽增加額外的描述性文字事件屬性UIeventsonclick(Script)ondblclick(Script)onmousedown(Script)onmouseup(Script)onmouseover(Script)onmousemove(Script)onmouseout(Script)onkeypress(Script)onkeydown(Script)onkeyup(Script)style屬性--用于定義HTML標(biāo)簽所使用的樣式示例<pstyle="font-size:12px;color:#000;">使用css</p>說明加載CSS的過程中,最好避免style屬性的使用,此屬性已經(jīng)被w3c拋棄,將來的HTML版本中可能移除此屬性.加載CSS的過程中,最好使用class屬性(或id屬性),這是標(biāo)準(zhǔn)的方法.<tablesummary="htmltable"border="0">標(biāo)簽<table>是表格標(biāo)簽.使用border屬性,定義沒有邊框的表格.使用summary屬性<linkrel="stylesheet"href="/style.css"type="text/css">rel與rev具有互補的作用,rel指定了向前鏈接的關(guān)系,rev指定了反向鏈接的關(guān)系.rev--代表文檔與鏈接到的內(nèi)容(href所指的內(nèi)容)的關(guān)系shape--使用圖像地圖的時候可以使用shape指定鏈接區(qū)域tabindex--代表使用"tab"鍵,遍歷鏈接的順序<ahref="/xhtml/"tabindex="1">1</a><ahref="/css/"tabindex="3">3</a><ahref="/"tabindex="2">2</a><!--連續(xù)按"Tab",可以改變焦點的位置.遍歷的順序是1-2-3.-->target--用來指出哪個窗口或框架應(yīng)該被此鏈接打開_blank--在新窗口中打開鏈接_parent--在父窗體中打開鏈接_self--在當(dāng)前窗體打開鏈接,此為默認(rèn)值_top--在當(dāng)前窗體打開鏈接,并替換當(dāng)前的整個窗體(框架頁)一個對應(yīng)的框架頁的名稱--在對應(yīng)框架頁中打開title--代表鏈接的附加提示信息<ahref="/xhtml/"title="HTML與XHTML入門教程">XHTML學(xué)習(xí)</a><imgsrc="/images/javascript_alert.png"alt="alert對話框"title="alert對話框圖示"/>type--代表鏈接的MIME類型鏈接到指定位置(所謂指定位置的鏈接,就是直接鏈接到文檔中一個定義好的位置。)<h2id="top">頁面上部</h2><ahref="#bottom">鏈接到頁面下部</a><ahref="#top">鏈接到頁面上部</a><h2id="bottom">頁面下部</h2>郵件鏈接<p><ahref="/javascript/object_math/#syntax"id="bottom">鏈接到網(wǎng)址</a></p>圖像鏈接<ahref="/"title="baidu"><imgsrc="/img/logo.gif"/></a>img標(biāo)簽--代表HTML圖像Common--一般屬性(class,id,title:圖片的提示文字,當(dāng)鼠標(biāo)停留到圖片上時,會提示相關(guān)文字)alt--代表圖像的替代文字src--代表一個圖像源(就是圖像的位置)height--代表一個圖像的高度width--代表一個圖像的寬度dl標(biāo)簽--代表HTML自定義列表dt標(biāo)簽--代表HTML自定義列表項目dd標(biāo)簽--代表HTML自定義列表描述<dl><dt>www</dt><dd>WorldWideWeb的縮寫.</dd><dt>dreamdu</dt><dd>夢之都.</dd><dd>www的:).</dd><dt>com</dt><dt></dt><dt>cn</dt><dd>這都是域名的后綴.</dd></dl>顯示:夢之都HTML教程,HTMLdl標(biāo)簽示例.wwwWorldWideWeb的縮寫.dreamdu夢之都.www的:).comcn這都是域名的后綴.nl標(biāo)簽--代表HTML導(dǎo)航列表<nl><label>夢之都</label><lihref="#introduction">介紹</li><li><nl><label>網(wǎng)址(/)</label><lihref="#http">http://</li><lihref="#www">www</li><lihref="#dreamdu">dreamdu</li><lihref="#com">com</li></nl></li><lihref="#html">html教程</li><lihref="#css">css教程</li></nl>夢之都介紹網(wǎng)址(/)http://wwwdreamducomhtml教程css教程嵌套列表<ul><li>www.</li><li>dreamdu<dl><dt>dream</dt><dd>夢</dd><dt>du</dt><dd>實現(xiàn)你的夢想</dd></dl></li><li>.com</li></ul>Table標(biāo)簽---th表頭Common--一般屬性summary--代表表格的摘要說明width--代表表格的寬度border--代表表格邊框(此屬性應(yīng)該使用CSS實現(xiàn))cellspacing--代表表格邊框與表格內(nèi)容填充的距離,也是內(nèi)容填充之間的距離(此屬性應(yīng)該使用CSS實現(xiàn))cellpadding--代表內(nèi)容填充的寬度(此屬性應(yīng)該使用CSS實現(xiàn))tr標(biāo)簽Common--一般屬性align--代表行的水平對齊方式(left(左對齊)|center(居中對齊)|right(右對齊)|justify)(此屬性應(yīng)該使用CSS實現(xiàn))valign--代表行的垂直對齊方式(top(頂部對齊)|middle(中部對齊)|bottom(下部對齊)|baseline(基線對齊))(此屬性應(yīng)該使用CSS實現(xiàn))th標(biāo)簽Common--一般屬性abbr--代表表頭的簡寫axis--對單元格在概念上分類colspan--一行跨越多列headers--連接表格的數(shù)據(jù)與表頭rowspan--一列跨越多行scope--定義行或列的表頭scope--通過此屬性可以定義行或列的表頭取值col--定義列表頭row--定義行表頭<tr> <th></th> <thabbr="comdomain"scope="col">.com域名的數(shù)量</th> <thabbr="cndomain"scope="col">.cn域名的數(shù)量</th> <thabbr="netdomain"scope="col">.net域名的數(shù)量</th> </tr> <tr> <thabbr="2003s"scope="row">2003</th> <td>1000</td> <td>2000</td> <td>3000</td></tr>align--代表水平對齊方式(left(左對齊)|center(居中對齊)|right(右對齊)|justify)(此屬性應(yīng)該使用CSS實現(xiàn))valign--代表垂直對齊方式(top(頂部對齊)|middle(中部對齊)|bottom(下部對齊)|baseline(基線對齊))(此屬性應(yīng)該使用CSS實現(xiàn))td標(biāo)簽屬性Common--一般屬性abbr--代表表頭的簡寫axis--對單元格在概念上分類colspan--一行跨越多列headers--連接表格的數(shù)據(jù)與表頭rowspan--一列跨越多行scope--定義行或列的表頭align--代表水平對齊方式(left(左對齊)|center(居中對齊)|right(右對齊)|justify)(此屬性應(yīng)該使用CSS實現(xiàn))valign--代表垂直對齊方式(top(頂部對齊)|middle(中部對齊)|bottom(下部對齊)|baseline(基線對齊))(此屬性應(yīng)該使用CSS實現(xiàn))colgroup標(biāo)簽屬性Common--一般屬性span--定義一個colgroup跨越的列數(shù),默認(rèn)值為1col標(biāo)簽是單獨出現(xiàn)的,<col/>屬性Common--一般屬性span--定義一個col跨越的列數(shù),默認(rèn)值為1<styletype="text/css"> .yellow { color:#CCCC33; font-size:36px; } .blue { color:#3399CC; font-size:12px; } </style><colgroup> <col/> <colclass="yellow"/> <col/> <colspan="2"class="blue"/> </colgroup>body{ background-image:url('html_table.png');}Css文本letter-spacing--定義文本中字母的間距(中文為文字的間距)正值為增大距離,負(fù)值為縮小距離.letter-spacing定義了字與字之間的距離.word-spacing是控制字與字之間空格的寬度.夢之都CSS教程,letter-spacing示例,Allihavetodo,islearnCSS.(仔細(xì)看是字母之間的距離,不是空格本身的寬度,參考word-spacing屬性示例.)normal:正常(主要是根據(jù)用戶所使用的瀏覽器等設(shè)備)<length>:長度表示法text-decoration--定義文本是否有劃線以及劃線的方式[underline||overline||line-through||blink]:四個值中的一個或多個underline:定義有下劃線的文本overline:定義有上劃線的文本line-through:定義直線穿過文本blink:定義閃爍的文本text-transform--定義文本的大小寫狀態(tài),此屬性對中文無意義取值:capitalize|uppercase|lowercase|none|inheritcapitalize:首字母大寫uppercase:大寫lowercase:小寫none:正常無變化text-align--定義文本的對齊方式取值:left|right|center|justifyleft:左對齊right:右對齊center:居中justify:對齊每行的文字text-indent--定義文本首行的縮進(在首行文字之前插入指定的長度)正值向后縮,負(fù)值向前進.取值:<length>|<percentage>|inherit<length>:長度表示法<percentage>:百分比表示法white-space--空格內(nèi)元素的顯示方式取值:normal|pre|nowrap|pre-wrap|pre-line|inheritnormal:正常無變化(默認(rèn)處理方式.文本自動處理換行.假如抵達(dá)容器邊界內(nèi)容會轉(zhuǎn)到下一行)pre:保持HTML源代碼的空格與換行,等同與pre標(biāo)簽nowrap:強制文本在一行,除非遇到br換行標(biāo)簽pre-wrap:同pre屬性,但是遇到超出容器范圍的時候會自動換行pre-line:同pre屬性,但是遇到連續(xù)空格會被看作一個空格border:1pxsolidgreen;font-family--定

溫馨提示

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

評論

0/150

提交評論