- 爱易网页
-
HTML教程
- CSS鍒濈骇鎰熸偀二
日期:2014-05-16 浏览次数:21032 次
CSS鍒濈骇鎰熸偀2
瀛椾綋椋庢牸:font-style 灞炴€ф渶甯哥敤浜庤瀹氭枩浣撴枃鏈€?
normal - 鏂囨湰姝e父鏄剧ず
italic - 鏂囨湰鏂滀綋鏄剧ず
oblique - 鏂囨湰鍊炬枩鏄剧ず
italic 鍜?oblique 鐨勫尯鍒?鏂滀綋锛坕talic锛夋槸涓€绉嶇畝鍗曠殑瀛椾綋椋庢牸锛屽姣忎釜瀛楁瘝鐨勭粨鏋勬湁涓€浜涘皬鏀瑰姩锛屾潵鍙嶆槧鍙樺寲鐨勫瑙傘€備笌姝や笉鍚岋紝鍊炬枩锛坥blique锛夋枃鏈垯鏄甯哥珫鐩存枃鏈殑涓€涓€炬枩鐗堟湰銆?
閫氬父鎯呭喌涓嬶紝italic 鍜?oblique 鏂囨湰鍦?web 娴忚鍣ㄤ腑鐪嬩笂鍘诲畬鍏ㄤ竴鏍枫€?
瀛椾綋鍙樺舰:font-variant 灞炴€у彲浠ヨ瀹氬皬鍨嬪ぇ鍐欏瓧姣嶃€?
瀛椾綋鍔犵矖:font-weight 灞炴€ц缃枃鏈殑绮楃粏銆?
浣跨敤 bold 鍏抽敭瀛楀彲浠ュ皢鏂囨湰璁剧疆涓虹矖浣撱€?
鍏抽敭瀛?100 ~ 900 涓哄瓧浣撴寚瀹氫簡 9 绾у姞绮楀害銆傚鏋滀竴涓瓧浣撳唴缃簡杩欎簺鍔犵矖绾у埆锛岄偅涔堣繖浜涙暟瀛楀氨鐩存帴鏄犲皠鍒伴瀹氫箟鐨勭骇鍒紝100 瀵瑰簲鏈€缁嗙殑瀛椾綋鍙樺舰锛?00 瀵瑰簲鏈€绮楃殑瀛椾綋鍙樺舰銆傛暟瀛?400 绛変环浜?normal锛岃€?700 绛変环浜?bold銆?
瀛椾綋澶у皬:font-size 灞炴€ц缃枃鏈殑澶у皬
缁濆鍊硷細
灏嗘枃鏈缃负鎸囧畾鐨勫ぇ灏?
涓嶅厑璁哥敤鎴峰湪鎵€鏈夋祻瑙堝櫒涓敼鍙樻枃鏈ぇ灏忥紙涓嶅埄浜庡彲鐢ㄦ€э級
缁濆澶у皬鍦ㄧ‘瀹氫簡杈撳嚭鐨勭墿鐞嗗昂瀵告椂寰堟湁鐢?
鐩稿澶у皬锛?
鐩稿浜庡懆鍥寸殑鍏冪礌鏉ヨ缃ぇ灏?
鍏佽鐢ㄦ埛鍦ㄦ祻瑙堝櫒鏀瑰彉鏂囨湰澶у皬
娉ㄦ剰锛氬鏋滄偍娌℃湁瑙勫畾瀛椾綋澶у皬锛屾櫘閫氭枃鏈紙姣斿娈佃惤锛夌殑榛樿澶у皬鏄?16 鍍忕礌 (16px=1em)銆?
鍦ㄦ墍鏈夋祻瑙堝櫒涓潎鏈夋晥鐨勬柟妗堟槸涓?body 鍏冪礌锛堢埗鍏冪礌锛変互鐧惧垎姣旇缃粯璁ょ殑 font-size 鍊?
閾炬帴鐨勫洓绉嶇姸鎬侊細
a:link - 鏅€氱殑銆佹湭琚闂殑閾炬帴
a:visited - 鐢ㄦ埛宸茶闂殑閾炬帴
a:hover - 榧犳爣鎸囬拡浣嶄簬閾炬帴鐨勪笂鏂?
a:active - 閾炬帴琚偣鍑荤殑鏃跺埢
褰撲负閾炬帴鐨勪笉鍚岀姸鎬佽缃牱寮忔椂锛岃鎸夌収浠ヤ笅娆″簭瑙勫垯锛?
a:hover 蹇呴』浣嶄簬 a:link 鍜?a:visited 涔嬪悗
a:active 蹇呴』浣嶄簬 a:hover 涔嬪悗
CSS 鍒楄〃灞炴€?list)
灞炴€?鎻忚堪
list-style 绠€鍐欏睘鎬с€傜敤浜庢妸鎵€鏈夌敤浜庡垪琛ㄧ殑灞炴€ц缃簬涓€涓0鏄庝腑銆?
list-style-image 灏嗗浘璞¤缃负鍒楄〃椤规爣蹇椼€?
list-style-position 璁剧疆鍒楄〃涓垪琛ㄩ」鏍囧織鐨勪綅缃€?
list-style-type 璁剧疆鍒楄〃椤规爣蹇楃殑绫诲瀷銆?
marker-offset
鎶樺彔杈规
border-collapse 灞炴€ц缃槸鍚﹀皢琛ㄦ牸杈规鎶樺彔涓哄崟涓€杈规锛?
table
{
border-collapse:collapse;
}
border-spacing 灞炴€ц缃浉閭诲崟鍏冩牸鐨勮竟妗嗛棿鐨勮窛绂伙紙浠呯敤浜庘€滆竟妗嗗垎绂烩€濇ā寮忥級銆?
CSS Table 灞炴€?
灞炴€?鎻忚堪
border-collapse 璁剧疆鏄惁鎶婅〃鏍艰竟妗嗗悎骞朵负鍗曚竴鐨勮竟妗嗐€?
border-spacing 璁剧疆鍒嗛殧鍗曞厓鏍艰竟妗嗙殑璺濈銆?
caption-side 璁剧疆琛ㄦ牸鏍囬鐨勪綅缃€?
empty-cells 璁剧疆鏄惁鏄剧ず琛ㄦ牸涓殑绌哄崟鍏冩牸銆?
"CSS" 鍒椾腑鐨勬暟瀛楁寚绀哄摢涓?CSS 鐗堟湰瀹氫箟浜嗚灞炴€с€?
灞炴€?鎻忚堪 CSS
outline 鍦ㄤ竴涓0鏄庝腑璁剧疆鎵€鏈夌殑杞粨灞炴€с€?
outline-color 璁剧疆杞粨鐨勯鑹层€?
outline-style 璁剧疆杞粨鐨勬牱寮忋€?
outline-width 璁剧疆杞粨鐨勫搴︺€?
outline-style鐨勫€?
鍊?鎻忚堪
none 榛樿銆傚畾涔夋棤杞粨銆?
dotted 瀹氫箟鐐圭姸鐨勮疆寤撱€?
dashed 瀹氫箟铏氱嚎杞粨銆?
solid 瀹氫箟瀹炵嚎杞粨銆?
double 瀹氫箟鍙岀嚎杞粨銆傚弻绾跨殑瀹藉害绛夊悓浜?outline-width 鐨勫€笺€?
groove 瀹氫箟 3D 鍑规Ы杞粨銆傛鏁堟灉鍙栧喅浜?outline-color 鍊笺€?
ridge 瀹氫箟 3D 鍑告Ы杞粨銆傛鏁堟灉鍙栧喅浜?outline-color 鍊笺€?
inset 瀹氫箟 3D 鍑硅竟杞粨銆傛鏁堟灉鍙栧喅浜?outline-color 鍊笺€?
outset 瀹氫箟 3D 鍑歌竟杞粨銆傛鏁堟灉鍙栧喅浜?outline-color 鍊笺€?
inherit 瑙勫畾搴旇浠庣埗鍏冪礌缁ф壙杞粨鏍峰紡鐨勮缃€?
outline-width鐨勫€?
鍊?鎻忚堪
thin 瑙勫畾缁嗚疆寤撱€?
medium 榛樿銆傝瀹氫腑绛夌殑杞粨銆?
thick 瑙勫畾绮楃殑杞粨銆?
length 鍏佽鎮ㄨ瀹氳疆寤撶矖缁嗙殑鍊笺€?
inherit 瑙勫畾搴旇浠庣埗鍏冪礌缁ф壙杞粨瀹藉害鐨勮缃€?
table-layout 璁剧疆鏄剧ず鍗曞厓銆佽鍜屽垪鐨勭畻娉曘€?
涔熼€氳繃浣跨敤涓嬮潰鍥涗釜鍗曠嫭鐨勫睘鎬э紝鍒嗗埆璁剧疆涓娿€佸彸銆佷笅銆佸乏鍐呰竟璺濓細
padding-top
padding-right
padding-bottom
padding-left
涓婁笅鍐呰竟璺濅笌宸﹀彸鍐呰竟璺濅竴鑷达紱鍗充笂涓嬪唴杈硅窛鐨勭櫨鍒嗘暟浼氱浉瀵逛簬鐖跺厓绱犲搴﹁缃紝鑰屼笉鏄浉瀵逛簬楂樺害銆?
鍏冪礌鐨勮竟妗?(border) 鏄洿缁曞厓绱犲唴瀹瑰拰鍐呰竟璺濈殑涓€鏉℃垨澶氭潯绾裤€?
濡傛灉鎮ㄥ笇鏈涗负鍏冪礌妗嗙殑鏌愪竴涓竟璁剧疆杈规鏍峰紡锛岃€屼笉鏄缃墍鏈?4 涓竟鐨勮竟妗嗘牱寮忥紝鍙互浣跨敤涓嬮潰鐨勫崟杈硅竟妗嗘牱寮忓睘鎬э細
border-top-style
border-right-style
border-bottom-style
border-left-style
濡傛灉涓哄杈硅窛鎸囧畾浜?3 涓€硷紝鍒欑 4 涓€硷紙鍗冲乏澶栬竟璺濓級浼氫粠绗?2 涓€硷紙鍙冲杈硅窛锛夊鍒跺緱鍒般€傚鏋滅粰瀹氫簡涓や釜鍊硷紝绗?4 涓€间細浠庣 2 涓€煎鍒跺緱鍒帮紝绗?3 涓€硷紙涓嬪杈硅窛锛変細浠庣 1 涓€硷紙涓婂杈硅窛锛夊鍒跺緱鍒般€傛渶鍚庝竴涓儏鍐碉紝濡傛灉鍙粰瀹氫竴涓€硷紝閭d箞鍏朵粬 3 涓杈硅窛閮界敱杩欎釜鍊硷紙涓婂杈硅窛锛夊鍒跺緱鍒般€?
澶栬竟璺濆悎骞舵寚鐨勬槸锛屽綋涓や釜鍨傜洿澶栬竟璺濈浉閬囨椂锛屽畠浠皢褰㈡垚涓€涓杈硅窛銆?
鍚堝苟鍚庣殑澶栬竟璺濈殑楂樺害绛変簬涓や釜鍙戠敓鍚堝苟鐨勫杈硅窛鐨勯珮搴︿腑鐨勮緝澶ц€呫€?
褰撲竴涓厓绱犲嚭鐜板湪鍙︿竴涓厓绱犱笂闈㈡椂锛岀涓€涓厓绱犵殑涓嬪杈硅窛涓庣浜屼釜鍏冪礌鐨勪笂澶栬竟璺濅細鍙戠敓鍚堝苟銆?
褰撲竴涓厓绱犲寘鍚湪鍙︿竴涓厓绱犱腑鏃讹紙鍋囪娌℃湁鍐呰竟璺濇垨杈规鎶婂杈硅窛鍒嗛殧寮€锛夛紝瀹冧滑鐨勪笂鍜?鎴栦笅澶栬竟璺濅篃浼氬彂鐢熷悎骞躲€?
灏界鐪嬩笂鍘绘湁浜涘鎬紝浣嗘槸澶栬竟璺濈敋鑷冲彲浠ヤ笌鑷韩鍙戠敓鍚堝苟銆?
鍋囪鏈変竴涓┖鍏冪礌锛屽畠鏈夊杈硅窛锛屼絾鏄病鏈夎竟妗嗘垨濉厖銆傚湪杩欑鎯呭喌涓嬶紝涓婂杈硅窛涓庝笅澶栬竟璺濆氨纰板埌浜嗕竴璧凤紝瀹冧滑浼氬彂鐢熷悎骞?