csdn blog css×Ô¶¨ÒåÉèÖã¨×ª£©
¡¾×÷Õߣºrare¡¿
csdn blog css×Ô¶¨ÒåÉèÖÃ
¿ÉÒÔÔÚ²©¿ÍµÄÅäÖÃÒ³ÃæµÄ×Ô¶¨ÒåcssÀ¸ÖÐÌîÈëcssÑùʽ´úÂëÀ´×Ô¶¨Ò²blogµÄ·ç¸ñ
csdn blogµÄÒ³Ãæ¼Ü¹¹»ù±¾ÊÇÓÉdivʵÏֵģ¬Õû¸öÒ³ÃæÖ÷ÒªÓÉÈý¸ödiv×é³É£¬ËüÃǵÄid·Ö±ðÊÇ:
csdnblog_header, csdnblog_sidebar, csdnblog_content¡£
ËùÒÔ£¬¶¨ÒåËüÃǵÄÖ÷ÌåÑùʽ¿ÉÒÔÕâÑù:
#csdnblog_header
{
//Í·²¿µÄ·ç¸ñ
}
#csdnblog_sidebar
{
//²à±ßÀ¸µÄ·ç¸ñ
}
#csdnblog_content
{
//Ö÷ÌåÄÚÈݵķç¸ñ
}
ÕâÈý¸ödivÓÖ±»Á½¸ödiv°ü¹üÆðÀ´ÁË£¬ËüÃǵÄid·Ö±ðÊÇcsdnblog_allwrap, csdnblog_midwrap
ÕâÁ½¸ö»¹¿ÉÒÔ¶¨ÒåÕû¸öÒ³ÃæµÄÕûÌåÑùʽ
#csdnblog_allwrap
{
//ÄãÏëÒªµÄ·ç¸ñ
}
#csdnblog_midwrap
{
//ÄãÏëÒªµÄ·ç¸ñ
}
Ò³ÃæµÄÍ·²¿ÓÉÒÔϼ¸²¿·Ö×é³É
1¡¢h1£¬ÏÔʾblogµÄÓû§×Ô¶¨Òå±êÌâ
#csdnblog_header h1
{
//±êÌâ·ç¸ñÉèÖÃ
}
2¡¢h2£¬ÏÔʾÓû§×Ô¶¨ÒåµÄblogÃèÊö
#csdnblog_header h2
{
//blogÃèÊö·ç¸ñÉèÖÃ
}
3¡¢ul, idΪpersonalnav, ¸öÈ˵¼º½Áбí
#csdnblog_header ul#personalnav
{
//blog¸öÈ˵¼º½À¸·ç¸ñÉèÖÃ
}
4¡¢ul£¬idΪblogsearchsty£¬ËÑË÷À¸
#csdnblog_header ul#blogsearchsty
{
//blogËÑË÷¿ò·ç¸ñÉèÖÃ
//Èç¹û²»ÏëÏÔʾ£¬¿ÉÒÔʹÓÃ:
//display:none
}
5¡¢ul£¬idΪmenu£¬²Ëµ¥À¸
#csdnblog_header ul#menu
{
//blog²Ëµ¥·ç¸ñÉèÖÃ
//Èç¹û²»ÏëÏÔʾ£¬¿ÉÒÔʹÓÃ:
//display:none
}
×Ô¶¨Òå²à±ßÀ¸µÄCSS
²à±ßÀ¸Ö÷divµÄidΪcsdnblog_sidebar,Öм䱻һ²ãclassΪgutterµÄdiv°ü¹ü£¬×îÀïÃæÒ»²ãdivµÄµÄclassΪaboutauthor¡£ÀïÃæÊ£ÏµľÍÊÇÒ»¸ö¸öµÄdlÁË
ÐÞ¸ÄÆð·ç¸ñ¿ÉÒÔÕâÑù£º
#csdnblog_sidebar div.gutter div.aboutauthor
{
}
¸ü½øÒ»²½µÄ»°£¬¿ÉÒÔ£º
#csdnblog_sidebar div.gutter div.aboutauthor dl
{
}
#csdnblog_sidebar div.gutter div.aboutauthor dl dt
{
}
#csdnblog_sidebar div.gutter div.aboutauthor dl dd
{
}
×Ô¶¨ÒåÎÄÕµÄCSS
ÿһƪÎÄÕ¶¼ÊÇÒ»¸ödiv£¬ÆäclassΪdefault_contents, Õâ¸ödiv°üº¬Á½¸ö×ÓÔªËØ
1¡¢h6£¬ classΪpubtime£¬ ÓÃÀ´ÏÔʾÎÄÕ·¢±íµÄʱ¼ä¡£
ÐÞ¸ÄÆäcssµÄ·½·¨Îª
.
Ïà¹ØÎĵµ£º
ÔÚÕâÖÖä¯ÀÀÆ÷ÏÂÏÔʾÕý³££¬ÔÚÁíÒ»ÖÖϾÍÂÒÁË£¬ÎÒÃÇÔÚ±àдCSSµÄʱºò»áºÜÄջ𣬸ÕÐÞ¸´ÁËÕâ¸öä¯ÀÀÆ÷µÄÎÊÌ⣬½á¹ûÁíÍâÒ»¸öä¯ÀÀÆ÷È´³öÁËÐÂÎÊÌâ¡£
-
ʲôÊÇä¯ÀÀÆ÷¼æÈÝ£ºµ±ÎÒÃÇʹÓò»Í¬µÄä¯ÀÀÆ÷£¨Firefox IE7
IE6£©·ÃÎÊͬһ¸öÍøÕ¾£¬»òÕßÒ³ÃæµÄʱºò£¬»á³öÏÖһЩ²»¼æÈݵÄÎÊÌ⣬ÔÚÕâÖÖä¯ÀÀÆ÷ÏÂÏÔʾÕý³£ ......
½ñÌìÓöµ½Òª×öCSSʵÏֲ˵¥Ô²½Ç±³¾°µÄЧ¹û, ËùÒÔÔÚÍøÉÏËÑÁËһϣ¬·¢ÏÖ´Ë·½·¨×î¼òµ¥¿ÉÐÐ~~ÌØ¼Ç¼ÏÂÀ´¹©´ó¼ÒÒ»ÆðʹÓÃ~~~
.nav ul li a{float:left; display:block; padding: 0 10px;
} /*×¢Òâpadding*/
.nav ul li a:hover{padding:0 0 0 10px;
display:block; background:url(images/tableft1.jpg) left top no-repeat # ......
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>±í¸ñÍ·Ðй̶¨£ºÊ¹ÓÃCSSʵÏÖ</title>
<style type="text/css" >
div.DivContainer /* Div */{
overflow: scroll;
border: solid 1px gray; ......
¹ö¶¯ÌõÑùʽÖ÷񻃾¼°µ½ÈçÏÂCSSÊôÐÔ:
overflowÊôÐÔ: ¼ìË÷»òÉèÖõ±¶ÔÏóµÄÄÚÈݳ¬¹ýÆäÖ¸¶¨¸ß¶È¼°¿í¶ÈʱÈçºÎÏÔʾÄÚÈÝ
overflow: auto; ÔÚÐèҪʱÄÚÈÝ»á×Ô¶¯Ìí¼Ó¹ö¶¯Ìõ
overflow: scroll; ×ÜÊÇÏÔʾ¹ö¶¯Ìõ
overflow-x: hidden; ½ûÖ¹ºáÏòµÄ¹ö¶¯Ìõ
overflow-y: scroll; ×ÜÊÇÏÔʾ×ÝÏò¹ö¶¯Ìõ
width: 568px; width: 98%; ÉèÖÃÇøÓòµÄ ......
±ÈÈçÒª·Ö±æIE6ºÍfirefoxÁ½ÖÖä¯ÀÀÆ÷£¬¿ÉÒÔÕâÑùд£º
¡¡¡¡<style>
¡¡¡¡div{
¡¡¡¡background:green; /* for firefox */
¡¡¡¡*background:red; /* for IE6 */
¡¡¡¡}
¡¡¡¡</style>
¡¡¡¡ÎÒÔÚIE6Öп´µ½ÊǺìÉ«µÄ£¬ÔÚfirefoxÖп´µ½ÊÇÂÌÉ«µÄ¡£
¡¡¡¡½âÊÍһϣº
¡¡¡¡ÉÏÃæµÄcssÔÚfirefoxÖУ¬ËüÊÇÈÏʶ²»Á˺óÃæµÄÄǸö´ ......