»ù±¾CSSÑ¡ÔñÆ÷,¸´ºÏÑ¡ÔñÆ÷,ºó´úÑ¡ÔñÆ÷
»ù±¾CSSÑ¡ÔñÆ÷Óбê¼ÇÑ¡ÔñÆ÷¡¢Àà±ðÑ¡ÔñÆ÷¡¢IDÑ¡ÔñÆ÷3ÖÖ
1¡£±ê¼ÇÑ¡ÔñÆ÷
ÿһÖÖHTML±ê¼ÇµÄÃû³Æ¶¼¿ÉÒÔ×÷ΪÏàÓ¦µÄ±ê¼ÇÑ¡ÔñÆ÷µÄÃû³Æ£¬Èçh1,p,µÈµÈ
2¡£Àà±ðÑ¡ÔñÆ÷
Àà±ðÑ¡ÔñÆ÷µÄÃû³Æ¿ÉÒÔÓÉÓû§×Ô¶¨Òå
¸ñʽÈçÏ£º.class{color:green;font-size:20px;}
3¡£IDÑ¡ÔñÆ÷
ÓëÀà±ðÑ¡ÔñÆ÷ÏàÊÔ
¸ñʽÈçÏ£º#id{color:green;font-size:20px;}
¸´ºÏÑ¡ÔñÆ÷£º¾ÍÊÇÁ½¸ö»òÕß¶à¸ö»ù±¾Ñ¡ÔñÆ÷£¬Í¨¹ý²»Í¬·½Ê½Á¬½Ó¶ø³ÉµÄÑ¡ÔñÆ÷
ÓÐÁ½ÖÖÇé¿ö£º”½»¼¯“Ñ¡ÔñÆ÷¡¢“²¢¼¯”Ñ¡ÔñÆ÷
1¡£“½»¼¯”Ñ¡ÔñÆ÷£ºÓÉÁ½¸öÑ¡ÔñÆ÷Ö±½ÓÁ¬½Ó¹¹³É£¬Æä½á¹ûÊÇÑ¡ÖжþÕ߸÷×ÔÔªËØ·¶Î§µÄ½»¼¯£¬ÆäÖеÚÒ»±ØÐëÊDZê¼ÇÑ¡ÔñÆ÷£¬µÚ¶þ¸ö±ØÐëÊÇÀà±ðÑ¡ÔñÆ÷»òÕßIDÑ¡ÔñÆ÷£¬Á½¸öÑ¡ÔñÆ÷Ö®¼ä²»ÄÜÓпոñ£¬±ØÐëÁ¬ÐøÊéд
È磺h3.class{color:red;font-size:23px;}
2¡£“²¢¼¯”Ñ¡ÔñÆ÷£ºÍ¬Ê±Ñ¡Öи÷¸ö»ù±¾Ñ¡ÔñÆ÷ËùÑ¡ÔñµÄ·¶Î§£¬ÈκÎÐÎʽµÄÑ¡ÔñÆ÷¶¼¿ÉÒÔ£¬²¢¼¯Ñ¡ÔñÆ÷ÊǶà¸öÑ¡ÔñÆ÷ͨ¹ý¶ººÅÁ¬½Ó¶ø³ÉµÄ£¬
¸ñʽÈç:h1,h2,h3{color:red;font-size:23px;}
ºó´úÑ¡ÔñÆ÷£º
ºó´úÑ¡ÔñÆ÷Êéд·½·¨£º°ÑÍâ²ãµÄ±ê¼ÇдÔÚÇ°Ãæ£¬ÄÚ²ãµÄ±ê¼ÇдÔÚºóÃæ£¬Ö®¼äÓÿոñ·Ö¸ô£¬µ±±ê¼Ç·¢ÉúǶÌ×ʱ£¬ÄÚ²ãµÄ±ê¼Ç¾Í³ÉΪÍâ²ã±ê¼ÇµÄºó´úÁË
¾Ù¸öÁÐ×Ó
<html>
<head>
<title>ºó´úÑ¡ÔñÆ÷</title>
<style type="text/css">
p span{}{
color:red
}
span
{}{
color:blue;
}
</style>
</head>
<body>
<p>ǶÌ×<span>ÓÃCSS</span>±ê¼ÇµÄ·½·¨</p>ǶÌ×Ö®ÍâµÄ<span>±ê¼Ç</span>²»ÉúЧ
</body>
</html>
Ч¹ûÊÇ£º“ÓÃCSS”µÄÏÔʾºìÉ«£¬ÆäËûÓÃ<span>°üΧÆðÀ´µÄÊÇÀ¼É«
ºó´úÑ¡ÔñÆ÷²úÉúµÄÓ°Ïì²»½öÏÞÓÚÔªËØµÄ“Ö±½Óºó´ú”£¬¶øÇÒ»áÓ°Ïìµ½ËüµÄ“¸÷¼¶ºó´ú”
×ÓÑ¡ÔñÆ÷£ºÒ²¾ÍÊÇÖ»ÓжÔÖ±½Óºó´úÓÐÓ°ÏìµÄÑ¡ÔñÆ÷£¬¶ø¶Ô“Ëï×Ó”ÒÔ¼°¶Ô¸ö²ãµÄºó´ú²»²úÉú×÷Óá£
¸ñʽÈçÏ£ºp>span{color:blue;}
Ïà¹ØÎĵµ£º
ÍøÒ³¿É¼ûÇøÓò¿í£º document.body.clientWidth;
ÍøÒ³¿É¼ûÇøÓò¸ß£º document.body.clientHeight;
ÍøÒ³¿É¼ûÇøÓò¿í£º document.body.offsetWidth (°üÀ¨±ßÏߵĿí);
ÍøÒ³¿É¼ûÇøÓò¸ß£º document.body.offsetHeight (°üÀ¨±ßÏߵĿí);
ÍøÒ³ÕýÎÄÈ«ÎÄ¿í£º document.body.scrollWidth;
ÍøÒ³ÕýÎÄÈ«Îĸߣº document.body. ......
ÓÃCSSÈÃÔªËØ¾ÓÖÐÏÔʾ²¢²»ÊǼþºÜ¼òµ¥µÄÊÂÇ顣ͬÑùµÄCSS¾ÓÖÐÉèÖÃÔÚ²»Í¬ä¯ÀÀÆ÷ÖеıíÏÖÒ²¸÷ÓÐǧÇï¡£±¾ÎľͽéÉÜÁËÔÚCSSÖг£¼ûµÄ¼¸ÖÖÈÃÔªËØË®Æ½¾ÓÖÐÏÔʾµÄ·½·¨¡£
¡¡¡¡1.ʹÓÃ×Ô¶¯Íâ±ß¾àʵÏÖ¾ÓÖÐ
¡¡¡¡CSSÖÐÊ×Ñ¡µÄÈÃÔªËØË®Æ½¾ÓÖеķ½·¨¾ÍÊÇʹÓÃmarginÊôÐÔ—½«ÔªËصÄmargin-leftºÍmargin-rightÊôÐÔÉèÖÃΪauto¼´¿É¡£ÔÚʵ¼ÊʹÓà ......
Ч¹ûͼ£º
csstest.css
*{
margin-left:0;
margin-top:0;
font-size:12px;
color:White;
}
#biaoge
{
/*¶ÔIDΪbiaogeµÄ±êǩʹÓôËCSS*/
width:405px; /*Áпí100£¬¼ÓÉÏÎå¸öΪ1µÄ±ß¾à£¬ËÄÁоÍÊÇ405*/
&nbs ......
magento¸ö±ðÒ³ÃæÌí¼ÓcssºÍjsÎļþ£¬¿ÉÒÔ½«Æä·ÅÔÚ¸ö±ðÒ³ÃæµÄxmlÖУ¬»òÕß·ÅÔÚCMSµÄlayout updateÖУ¬Æä´úÂëºÍÎļþ´æ·ÅλÖÃÈçÏÂ
<reference name="head">
<action method="addCss"><stylesheet>css/mystyles.css</stylesheet></action>
//Ìí¼Ócss mystyles.css ÎļþÔÚ /skin/frontend/Ö÷Ìâ ......
dz̸IEÓëFirefox¶ÔCSSµÄ²»Í¬½âÎö——°²»ÕÓ¿ÍËÉ
Æäʵ£¬ÒÔǰ´ÓÀ´Ã»ÓнӴ¥¹ýCSSÏà¹ØµÄÄÚÈÝ£¬¶¼ÊÇÔÚ×öÒµÎñµÄ±à³Ì£¬´ÓÀ´Ã»Ïë¹ýÇ°Ì¨Ò³ÃæµÄÉè¼ÆÒ²ÄÜÈç´Ë¸´ÔÓ¡£Õâ´ÎÏîÄ¿µÄ¿ª¹ý¹ý³ÌÖУ¬×÷ΪCSS²ËÄñµÄÎÒÒ²½Ó´¥µ½CSSµÄÏà¹ØÉè¼Æ¡£Ëù³öÏֵĵͼ¶ÎÊÌâºÍÀ˷Ѻܶàʱ¼äµÄ×´¿öÒ²²ã³ö²»ÇËùÒÔͨ¹ý¸÷·½ËÑË÷ºÍ×Ô¼ºµÄʵ¼ÊѧϰÖÐ×ܽ᳠......