1.1、html

Css樣式 ＜metahttp-equiv="refresh""＜isindexprompt="提示文字＜basehref=" </h#>#=1~6；h1為最大字，h6為最小<a圖像<imgsrc=”URLwidth=”10height=”10平行線<hr/>用于分割內(nèi)容換行<br><br/>html<style=”font-family:verdana;<bodybgcolor=”red”>font-family:verdana字體color:red顏色font-size:10text-align:center文本對(duì)齊bgcolor:red背景顏色＜＜imgsrc="圖形文件名"＞定義表格 table 定義行 表頭 表格數(shù)據(jù) 表格中內(nèi)容排列<td <th <table<tableborder="1"cellpadding="10"<tableborder="1"<tableborder="1"<td<td<thalign="left">消費(fèi)項(xiàng) <td<tdCSS外部導(dǎo)直 <style--javascript-加載外部.js獨(dú)立文件二、CSS文字屬性color999999*文字顏色font-family:宋體,sans-serif*文字字體*/font-size:9pt;/*文字大小*/ ic*文字斜體;/letter-spacing1pt*字間距離*/line-height:200%;/*設(shè)置行高*/font-weight:bold;/*文字粗體*/vertical-align:sub;/*下標(biāo)字*/;/text-decoration:overline;/*加頂線*/text-decoration:underline;/*加下劃線*/text-decoration:none;/*刪除 text-transform:capitalize;/*首字大寫*/text-transform:uppercase;/*英文大寫*/text-transform:lowercase;/*英文小寫*/text-align:right;/*文字右對(duì)齊*/;/text-align:center*文字居中對(duì)齊*/text-align:justify;*文字分散對(duì)齊*/vertical-align屬性;/vertical-align:bottom*垂直向下對(duì)齊*/vertical-align:middle;/*垂直居中對(duì)齊*/;/;/三、CSS符號(hào)屬性/;/ 數(shù)字list-style-type:lower-roman*小寫羅馬數(shù)字*/list-style-type:lower-alpha;/*小寫英文字母*/list-style-type:disc;/*實(shí)心圓形符號(hào)*///list-style-image:url(/dot.gif*式符號(hào)*/list-style-position:outside;*凸排*//四、CSS背景樣式background-color:#F5E2EC*背景顏色*/background:transparent;/*背景*/background-imageurl(/image/bg.gif*背景*/background-attaentfixed;*浮水印固定背景*/background-repeatrepeat;*重復(fù)排列-網(wǎng)頁(yè)默認(rèn)*/background-repeat:no-repeat;/*不重復(fù)排列*/background-repeatrepeat-x*x軸重復(fù)排列*/background-repeatrepeat-y;*y軸重復(fù)排列*/background-position:90%90%;/*背景 x與y軸的位置*/background-position:top;/*向上對(duì)齊*/background-positionbuttom*向下對(duì)齊*/background-position:left;/*向左對(duì)齊*/background-position:right;/*向右對(duì)齊*/background-position:center;/*居中對(duì)齊*/五、CSS連接屬性a/*所有 a:link/* a:visited/*瀏覽過(guò)的 a:active/*按下 CURSORhand十字體cursor:crosshaircursor:s-resize十字箭頭cursor:move箭頭朝右cursor:move加一問(wèn)號(hào)cursor:helpcursor:w-cursor:n-箭頭朝右上cursor:ne-resizecursor:nw-resizeI型cursor:text箭頭斜右下cursor:se-resizecursor:sw-resize漏斗cursor:wait){六、CSS框線一覽表border-top:1pxsolid#6699cc;/*上框線*/border-bottom1pxsolid6699cc*下框線*/border-left:1pxsolid#6699cc;/*左框線*/border-right:1pxsolid#6699cc;/*右框線*/ 寫方式,但也可以使用常規(guī)的方式如下:border-top-color:#369/*設(shè)置上框線top顏色*/border-top-width:1px/*設(shè)置上框線top寬度*/border-top-stylesolid/*top樣式*/solid*實(shí)線框dotted/*dotted/*虛線框*/double/*雙線框*/groove*立體內(nèi)凸框*/ridge/*立體浮雕框*/inset/*凹框*/outset*凸框*/七、CSS<inputtype="textname="T1<inputtype="submitvalue="submit<inputtype="checkbox<inputtype="radiovalue="V1checked<textarearows="1name="S1八、CSSmargin-top:10px;/*上邊界*/margin-right:10px*右邊界值*/margin-left:10px;/*左邊界值*/九、CSSpadding-top:10px;/*上邊框留空白*/padding-right:10px;/*右邊框留空白*/padding-bottom:10px*下邊框留空白*/padding-left:10px;/*左邊框留空白*/

CSS基本語(yǔ)HTMLCSS1Ptext-indent:3emCLASS(類)，因而允許同一元素有不同樣式。例如，一個(gè)網(wǎng)頁(yè)制作者也許希望視其語(yǔ)言而定，用不同的顏色顯示代碼:code.html{color:#191970}code.css{color:#4b0082}HTML例如，prietary是無(wú)效的。</p>類的也可以無(wú)須相關(guān)的元素:.note{font-size:smallnotesmall，但如果網(wǎng)頁(yè)制作者決定改變這個(gè)類的樣式，使得它不再是小字IDIDID選擇符的指定要有指示符"#"在名字前面。例如，ID選擇符可以指定如下:#svp94O{text-indent:3emHTMLID屬性關(guān)聯(lián)選擇符只不過(guò)是一個(gè)用空格隔開的兩個(gè)或的單一選擇符組成的字符串這些選擇符PEM{background:yellowred。過(guò)組合給出相同的:H1,H2,H3,H4,H5,H6color:例如，一個(gè)BODY定義了的顏色值也會(huì)應(yīng)用到段落的文本中。屬性是不會(huì)繼承的；上，一個(gè)段落不會(huì)有同文檔BODY一樣的上邊界值。/*COMMENTSCANNOTBENESTED類的元素(例如，visitedlinks(已的連接)和activelinks(可激活連接)描述了兩個(gè)定位錨選擇符:偽類{屬性:值}選擇符:{屬性:HTMLCLASS屬性來(lái)指定。一般的類可以與偽類和偽元素一起使用，選擇符.類:偽類{屬性:值或選擇符.類:{屬性:值(activelinks)。定位錨元素可給出偽類link、visited或active。一個(gè)已連接可以定義為不已連接被重選時(shí)，又以不同顏色、更小字體顯示。這個(gè)樣式表的示例如下:A:link{color:redA:active{color:blue;font-size:125A:visitedcolorgreen;font-size:85WallStreetJournal中的，文本的首行都會(huì)以粗印體而且全部大(P、H1等等)。以下是一個(gè)首行偽元素的例子:font-weight:bold}首個(gè)字母?jìng)卧赜糜诩哟?dropcaps)和其他效果。含有已指定值選擇符的文本的首個(gè)字母會(huì)!規(guī)則可以用指定的!important特指為重要的。一個(gè)特指為重要的樣式會(huì)凌駕于與之對(duì)立的則會(huì)讀者的。以下是!important的例子:OriginofRules(Author'svs.網(wǎng)頁(yè)制作者應(yīng)該地使用!important規(guī)則，因?yàn)樗鼈儠?huì)用戶任何的!important規(guī)則。確定的樣式規(guī)則為!important，因?yàn)檫@些樣式對(duì)于用戶閱讀網(wǎng)頁(yè)是極為重要的。任何的!important規(guī)則會(huì)一般的規(guī)則，所以建議網(wǎng)頁(yè)制作者使用一般的規(guī)則以確保有特殊樣式選擇符規(guī)則:IDCLASS屬性個(gè)數(shù)。HTML標(biāo)記名格式。最后，按正確的順序?qū)懗鋈齻€(gè)數(shù)字，不要加空格或逗號(hào)，得到一個(gè)三位數(shù)。注意，你需要#id1{xxx*a=1b=0c=0-->100ULULLI.redxxx*a=0b=1c=3-->013*/LI.red{xxx}/*a=0b=1c=1-->特性=011*/LIxxx*a=0b=0c=1-->001HTML文檔更簡(jiǎn)易地組合起來(lái)。CLASSID屬性DIV元素HTMLLINKHTML文檔中 MEDIA="screen,print">MEDIA="screen,print"><LINK>標(biāo)記是放置在文檔的HEAD部分。可選的TYPE屬性用于指定類型--text/css是一個(gè)層疊樣式表--允許瀏覽器忽略它們不支持的樣式表類型。為CSS文件配置服務(wù)器而將text/cssContent-type內(nèi)容發(fā)送出去也是一個(gè)好注意。外部樣式表不能含有任何像<HEAD>或<STYLE>HTML的標(biāo)記。樣式表僅僅由樣式規(guī)則或組成。一個(gè)單獨(dú)由P{margin:2em<LINK>標(biāo)記也有一個(gè)可選的MEDIA屬性，用于指定樣式表被接受的介質(zhì)或。允許的值(多樣的通過(guò)用逗號(hào)隔開的列表或值all指定NetscapeNavigator4.x錯(cuò)誤地忽略除了screen值外的任何使用MEDIA值的連接或嵌入備是計(jì)算機(jī)的屏幕。Navigator4.x也忽略使用MEDIA=all的樣式表。RELHTML文檔之間的關(guān)系。REL=StyleSheet指定一個(gè)固定或首R(shí)EL="AlternateStyleSheet"定義一個(gè)交互樣式。固定樣式在樣式表激活時(shí)總被應(yīng)TITLE屬性，就像例子中的第一個(gè)<LINK>標(biāo)記，定義一個(gè)固定樣式。交互樣式通過(guò)REL="AlternateStyleSheet"。例子中的第三個(gè)<LINK>標(biāo)記定義一個(gè)交互樣<LINKREL=StyleSheetHREF="basics.css"<LINKREL=StyleSheetHREF="tables.css"TITLE。InternetExplorer3forWindows95/NT4并不支持來(lái)自連接的樣式表中的BODY背的結(jié)構(gòu)，例如嵌入或內(nèi)聯(lián)樣式，或使用BODY元素的BACKGROUND屬性。一個(gè)樣式表可以使用STYLE元素在文檔中嵌入BODY{background:url(foo.gif)red;color:black}PEM{background:yellow;color:black}.note{margin-left:5em;margin-right:5emSTYLE元素放在文檔的HEAD部分。必須的TYPE屬性用于指定類型，LINK元素也一樣。同樣地，TITLEMEDIASTYLE指定。STYLEBODY的一部分照常展示其內(nèi)容，從而使這些樣式表對(duì)用戶是可見(jiàn)的。要防止這樣做，STYLESGML注解(<!--comment-->)在里面，像上述例子那樣。一個(gè)樣式表可以使用CSS的@import被輸入。這個(gè)用于一個(gè)CSS文件或內(nèi)部STYLE元素@importurl(http: @importurl(/stylesheets/punk.css);DT{background:yellow;color:black注意其它的CSS規(guī)則應(yīng)該仍然包括在STYLE元素中但所有的@import必須放在樣式的樣式表指定了STRONGpunk.css樣式表指定了STRONG元素顯示為黃STRONG元素會(huì)顯示為黃色。義元素的規(guī)則這三個(gè)樣式表在需要的時(shí)候可以使用@import包括在HTML中三LINK元素組合。STYLE屬性內(nèi)聯(lián)。STYLEBODY元素(包括BODY本身)，除<PSTYLE="color:red;font-family:'NewCenturySchoolbook',serif">NewCenturySchoolbook字，如果字體可用的話。STYLENewCenturySchoolbook包含在單引號(hào)中，因?yàn)殡p引號(hào)被用作包含樣式聲Content-Style-TypeHTTPHEAD部分包括以下標(biāo)記:默認(rèn)地接受所有因?yàn)闆](méi)有任何的為內(nèi)聯(lián)樣式指定明確的的語(yǔ)句這種方法應(yīng)該盡元素的場(chǎng)合，但只能使用確認(rèn)的的話，使用ID屬性代替STYLE屬性。CLASS.punk{color:lime;background:#ff80c0這些類可以使用CLASS屬性在HTML中在這個(gè)例子的樣式表，warning類只能用于P元素。warningred，但如果網(wǎng)頁(yè)制作者決定改變這個(gè)類的樣式為別的顏色，或CSSHTMLIDIDCSS#wdg97{font-size:largerIDHTML中<PID=wdg97>歡迎WebDesignGroup及TVwaterA-Za-z。HTML4.0IDCSS1ID選擇符中有句號(hào)。也要注意CSS1Unicode161-255UnicodeHTML4.0不允ID屬性值當(dāng)中。IDIDSTYLE屬性相比，在于ID允許指定的樣式，而且也可以被應(yīng)用于多個(gè)文檔(雖然每個(gè)文檔只用一次)。SPANHTMLHTML的結(jié)構(gòu)元素上。SPANSTYLE、CLASSID屬性。SPANHTMLEMSTRONG使用。最重要的差EMSTRONGSPAN就沒(méi)有這樣的意義。它的存在純粹是<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML字的樣式為<SPANSTYLE="font-family:Arial">Arial</SPAN>.</P>DIV("是一個(gè)塊級(jí)元素。DIVDIV便于建立不同集成的類，如章節(jié)、或備注。例如:CLASS、STYLEID屬性。</P><P>DIV可以包含其他塊級(jí)集成，在用于建立文檔的大型章節(jié)例如本備注是很有用少數(shù)使用了CSS樣式的文檔能在HTML3.2(Wilbur)層(在WDG，譯者注)得到認(rèn)證。HTML3.2SPANCLASS、STYLEIDLINKSTYLE元TYPEMEDIA屬性。HTML4.0。報(bào)－人生活的故事！人的家園!人自己的報(bào)！/語(yǔ)法:disy:<值允許值block|inline|list-item|初始值適用于:所有對(duì)象向下兼容:否block(在元素的前和后都會(huì)有換行)inline在元素的前和后都不會(huì)有換行)list-item(與block相同,但增加了 none(沒(méi)有顯示)HTML規(guī)格建議的展示形式給出一個(gè)缺省的顯示值。none將關(guān)語(yǔ)法white-space值允許值normal|pre|初始值適用于:塊級(jí)元素向下兼容:是空白屬性將決定如何處理元素內(nèi)的空格.該屬性的值取以下三個(gè)中的一個(gè):normal(將多個(gè)空格折疊成一個(gè))pre不折疊空格(:<允許值disc|circle|square|decimal|lower-roman|upper-roman|lower-alpha|upper-alpha|none初始值適用于:帶有顯示值的 向下兼容:是 樣式圖象值為none或當(dāng)圖象載入選項(xiàng)例如LI.square{list-style-type:square}UL.in{list-style-type:none}OL{list-style-type:upper-alpha}/*ABCDEetc.*/OLOL{list-style-type:decimal}/*12345etc.*/OLOLOL{list-style-type:lower-roman}/*iiiiiiivvetc.:<允許值url>|初始值適用于:帶有顯示值的 向下兼容:是 例如UL.check{list-style-image:url(/LI-markers/checkmark.gif)}ULLI.x{list-style-image:url(x.png)}::<允許值inside|初始值適用于:帶有顯示值的項(xiàng)元素向下兼容:是屬性決定關(guān)于inside值，換行會(huì)移到標(biāo)記下，而不是縮OutsideListitemsecondlineoflistitemInsiderendering:Listitemse