CSS Ñ¡ÔñÆ÷ÓÅÏȼ¶
CSSÓÅÏȼ¶°üº¬Ëĸö¼¶±ð£¨ÎÄÄÚÑ¡ÔñÆ÷£¬IDÑ¡ÔñÆ÷£¬ClassÑ¡ÔñÆ÷£¬ÔªËØÑ¡ÔñÆ÷£©ÒÔ¼°¸÷¼¶±ð³öÏֵĴÎÊý¡£¸ù¾ÝÕâËĸö¼¶±ð³öÏֵĴÎÊý¼ÆËãµÃµ½CSSµÄÓÅÏȼ¶¡£
CSSÓÅÏȼ¶µÄ¼ÆËã¹æÔòÈçÏ£º
* Ò³ÃæÖÐÖ±½ÓÉèÖÃstyle,¼Ó1,0,0,0
* ÿ¸öIDÑ¡ÔñÆ÷(Èç #id),¼Ó0,1,0,0
* ÿ¸öClassÑ¡ÔñÆ÷(Èç .class)¡¢Ã¿¸öÊôÐÔÑ¡ÔñÆ÷(Èç [attribute=])¡¢Ã¿¸öαÀà(Èç :hover)¼Ó0,0,1,0
* ÿ¸öÔªËØÑ¡ÔñÆ÷£¨Èçp£©»òÎ±ÔªËØÑ¡ÔñÆ÷(Èç :firstchild)µÈ£¬¼Ó0,0,0,1
È»ºó£¬½«ÕâËĸöÊý×Ö·Ö±ðÀÛ¼Ó£¬¾ÍµÃµ½Ã¿¸öCSS¶¨ÒåµÄÓÅÏȼ¶µÄÖµ£¬
È»ºó´Ó×óµ½ÓÒÖðλ±È½Ï´óС£¬Êý×Ö´óµÄCSSÑùʽµÄÓÅÏȼ¶¾Í¸ß¡£
Àý×Ó£º
cssÎļþ»ò<style>ÖÐÈç϶¨Ò壺
1. h1 {color: red;}
/* Ò»¸öÔªËØÑ¡Ôñ·û£¬½á¹ûÊÇ0,0,0,1 */
2. body h1 {color: green;}
/* Á½¸öÔªËØÑ¡Ôñ·û£¬½á¹ûÊÇ 0,0,0,2 */
3. h2.grape {color: purple;}
/* Ò»¸öÔªËØÑ¡Ôñ·û¡¢Ò»¸öClassÑ¡Ôñ·û£¬½á¹ûÊÇ 0,0,1,1*/
4. li#answer {color: navy;}
/* Ò»¸öÔªËØÑ¡Ôñ·û£¬Ò»¸öIDÑ¡Ôñ·û£¬½á¹ûÊÇ0,1,0,1 */
5. ÔªËØµÄstyleÊôÐÔÖÐÈç϶¨Ò壺h1 {color: blue;}
/* Ò³ÃæÖж¨Ò壬һ¸öÔªËØÑ¡Ôñ·û£¬½á¹ûÊÇ1,0,0,1*/
Èç´ËÒÔÀ´£¬h1ÔªËØµÄÑÕÉ«ÊÇÀ¶É«¡£
×¢Ò⣺
1¡¢!importantÉùÃ÷µÄÑùʽÓÅÏȼ¶×î¸ß£¬Èç¹û³åÍ»ÔÙ½øÐмÆËã¡£
2¡¢Èç¹ûÓÅÏȼ¶Ïàͬ£¬ÔòÑ¡Ôñ×îºó³öÏÖµÄÑùʽ¡£
3¡¢¼Ì³ÐµÃµ½µÄÑùʽµÄÓÅÏȼ¶×îµÍ¡£
Ïà¹ØÎĵµ£º
¡¡¡¡½üÄêÀ´£¬CSS²»Í¸Ã÷ËãµÃÉÏÊÇÒ»ÖÖÏ൱Á÷Ðеļ¼Êõ£¬µ«ÔÚ¿çä¯ÀÀÆ÷Ö§³ÖÉÏ£¬¶ÔÓÚ¿ª·¢ÕßÀ´Ëµ£¬¿ÉÒÔ˵ÊÇÒ»¼þÁîÈËÍ·ÌÛµÄÊÂÇ顣Ŀǰ»¹Ã»ÓÐÒ»¸öͨÓ÷½·¨£¬ÒÔÈ·±£Í¸Ã÷¶ÈÉèÖÿÉÒÔÔÚĿǰʹÓõÄËùÓÐä¯ÀÀÆ÷ÉÏÓÐЧ¡£
¡¡¡¡ÕâÆª»ã×ÜÖ÷ÒªÊÇÌṩһЩCSS²»Í¸Ã÷µÄÏêϸ½éÉÜ£¬´úÂëʾÀýºÍ½âÊÍ£¬ÒÔʵÏÖÕâÏîÓÐÓõÄCSS¼¼ÊõÔÚÄúµÄÏîÄ¿ÖмæÈÝËùÓÐä¯À ......
ä¯ÀÀÆ÷¼æÈÝ¿ÉÒÔ˵ÊÇǰ¶Ë¿ª·¢ËùÒªÃæ¶ÔµÄµÚÒ»¸öÌôÕ½£¬Ä¿Ç°ÎҵĵçÄÔÉÏÒѾ°²×°ÁË6ÖÖä¯ÀÀÆ÷£¨»ùÓÚIEÄں˵IJ»Ë㣬ÈçMaxthonµÈ£©¡£
¡¡¡¡CSS hacksÀûÓÃä¯ÀÀÆ÷µÄ©¶´À´Òþ²ØÌض¨ä¯ÀÀÆ÷µÄCSS¹æÔò¡£ÊµÏÖä¯ÀÀÆ÷¼æÈÝÖ÷ÒªÓÐÁ½ÖÖ·½Ê½Ìõ¼þÑùʽ±íºÍCSS Hacks£¨Selector Hacks¡¢Attribute Hacks£©¡£¶Ô´Ë¸ù¾ÝһЩ×ÊÁÏ»ã×ÜÁËһЩCSS Hacks·½·¨¡ ......
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT=""& ......
ÒýÓÃÅ£È˾µä¿Ú¾ö
Ò»¡¢IE±ß¿òÈôÏÔÈôÎÞ£¬Ðë×¢Ò⣬¶¨ÊǸ߶ÈÉèÖÃÒÑÍü¼Ç£»
¶þ¡¢¸¡¶¯²úÉúÓÐÔµ¹Ê£¬ÈôÒª¸¸²ã°üº¬×¡£¬½ô¸ú¸¡¶¯ÒªÇå³ý£¬ÈÝÆ÷×ÔÈ»ÏÔÆäÖУ»
Èý¡¢ÈýÏñËØÎı¾ÂýÒÆ²»±Ø»Å£¬¸ß¶ÈÉèÖðïÄãæ£»
ËÄ¡¢¼æÈݸ÷¸öä¯ÀÀÐë×¢Ò⣬ĬÈÏÉèÖÃÐи߿ÉÄÜÊÇɱÊÖ£»
Îå¡¢¶ÀÁ¢Çå³ý¸¡¶¯ÐëÃú¼Ç£¬ÐиßÉèÎÞ£¬¸ßÉèÁ㣬Éè¼ÆÐ§¹û¼æä¯ÀÀ£»
Áù¡¢Ñ§²¼ ......
1¡¢CSS·ç¸ñÍøÕ¾£¬½«ÏÂÃæÕâ¶Î´úÂëÌí¼Óµ½ÍøÕ¾cssÎļþ×î¶¥¶Ë¡£
html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }
»òÕߣº
ÔÚcssÎļþµÄbodyÖмÓÈëfilter:gray£º
body {filter:gray}
¡¡¡¡2¡¢Î´ÆôÓÃCSS·ç¸ñÍøÕ¾£¬ÔÚÍøÒ³»òÕßÄ£°åµÄHTML´úÂëºÍÖ®¼ä²åÈëÒÔÏ´úÂ룺
<style>
html{filter:pro ......