div+cssѧϰ1
ÄÚÁªÊ½Ñùʽ±í
¶¨Ò壺ֱ½Ó¶Ôhtml±êǩдÑùʽ£¬È±µã£ºÈç¹û±êÇ©¹ý¶à£¬ÐèҪд¹ý¶àµÄÑùʽ
¹«Ê½£ºstyle="ÑùʽÊôÐÔ:ÊôÐÔµÄÖµ£»ÑùʽÊôÐÔ:ÊôÐÔµÄÖµ"
<p style="font-size:50px">aaaaaaaaa</p>
ǶÈëʽÑùʽ±í
Ìص㣺½«¹«¹²µÄÑùʽдÔÚ“head”²¿·ÖÀïÃæµÄ¡£È±µã:Èç¹û¼ÓÔØÑùʽµÄÒ³Ãæ¶à£¬ÐèҪдÖظ´ÄÚÈÝ¡£
¹«Ê½£º<style type="text/css">
<!-- ---µÄ×÷ÓÃÊÇ£ºÈç¹û²¿·Öä¯ÀÀÆ÷²»Ö§³ÖÑùʽ±íµÄ»°£¬Ëû¿ÉÒÔ×÷ΪHTMLÀïÃæµÄ×¢ÊÍʹÓ㬲»»áÏÔʾ´úÂë¡£µ«Ò»°ãµÄä¯ÀÀÆ÷¶¼Ö§³Ö¡£
±êÇ©|¶¨ÒåÃû×Ö { ÊôÐÔ:Öµ;
ÊôÐÔ:Öµ;
ÊôÐÔ:Öµ;
ÊôÐÔ:Öµ;
//-->
</style>
<html>
<head>
<title>111</title>
<style>
<!--
p {font-size:3cm;
color:red;
background-color:green;
text-decoration:underline;
}
//-->
</style>
</head>
</html>
ÍⲿÑùʽ±í
дÔÚheadÀïÃæµÄ<link>±êÇ©ÖУ¬¿ÉÒÔ½«ÍⲿµÄ±êÇ©µ¼Èëµ½±¾Ò³ÃæÖС£
È磺<link rel="stylesheet" type="text/css" href="css.css">
Ò³ÃæµÄÆäËûµØ·½Í¬Ç¶Èëʽcss
ÆäÖÐcss.cssÄÚÈÝΪ£¬È¥µôÁËstyle±êÇ©µÄ²¿·Ö£¬ÈçÏ£º
p {font-size:3cm;
color:red;
background-color:green;
text-decoration:underline;
}
ÊäÈëÑùʽ±í
½«Ò»¸öcssÑùʽ±íµ¼Èëµ½ÁíÍâÒ»¸öcssÑùʽ±íÖУ¬È磺ÓÐÁ½¸öcssÑùʽ±í£¬½Ð£ºcss.css ºÍdemo.css ÔÚcss.cssµ¼Èëdemo.css£¬¿ÉÔÚcss.cssдÈ룺
@import url(demo.css)
Ñùʽ¹æÔòµÄÑ¡ÔñÆ÷
1.HTMLÑ¡ÔñÆ÷
Ö±½ÓÐÞ¸Ähtml±êÇ©£¬È磺p£¬div£¬h1µÈ
2.ÀàÑ¡ÔñÆ÷ ----- Ò»¶Ô¶à
È磺
¹«Ê½£º±êÇ©.ÀàÃû×Ö{}
p.z1{ xx1 } ---Ö»ÄÜÔÚp±êÇ©ÖÐʹÓÃz1Ñùʽ
p.z2{ xx2 }
p.z3{ xx3 }
p.z4{ xx
Ïà¹ØÎĵµ£º
css
clearfix(Õë¶Ô»ðºüheight:autoÎÞЧ½â¾ö·½°¸)
FirefoxµÈ·ûºÏW3C±ê×¼µÄä¯ÀÀÆ÷ÖУ¬Èç¹ûÓÐÒ»¸öDIV×÷ΪÍⲿÈÝÆ÷£¬ÄÚ²¿µÄDIVÈç¹ûÉèÖÃÁËfloatÑùʽ£¬ÔòÍⲿµÄÈÝÆ÷DIVÒòΪÄÚ²¿Ã»ÓÐclear£¬µ¼Ö²»Äܱ»³Å¿ª¡£
Àý£º
<div style=" border:2px solid #0CC; width:600px;" >
<div style="
wi ......
CSSÖб³¾°Í¼Æ¬µÄÉèÖà ÂÜÀòÊÀ½ç ¸úÄúÒ»Æð¿´ÊÀ½ç http://lolier.info/ ¹Ø¼ü×Ö:CSS,ͼƬ,ÉèÖà CSSÖб³¾°Í¼Æ¬µÄÉèÖ㺠²»Æ½ÆÌ£ºbackground-repeat: no-repeat; ºáÏòƽÆÌ£ºbackground-repeat: repeat-x; ×ÝÏòƽÆÌ£ºbackground-repeat: repeat-y; ¹Ì¶¨£ºbackground-attachment: fixed; ¹ö¶¯£ºbackground-attachment: scroll; ......
×Ô¼º×ܽáµÄÐĵãº
1£ºÔÚcssÉè¼ÆÖУ¬µ±Í¼Æ¬²»¹»¿íʱ£¬Õâʱ¿ÉÒÔ¿¼ÂÇʹÓñ³¾°ÑÕÉ«£¨Óë¸ÃͼƬÏàËƵÄÑÕÉ«£©À´²¹³ä¡£
2£¬ÔÚcssÉè¼ÆÖУ¬¿ÉÒÔʹÓÃͼƬµÄ±³¾°É«ÏòÍøÒ³µÄ±³¾°É«¹ý¶É
Èçͼ£º
¾ßÌå²ÎÕÕ¡¶¾«Í¨JavaScript+Jquery¡·3-20.html ......
div+cssä¯ÀÀÆ÷¼æÈÝÎÊÌâ½â¾ö·½·¨
´ÓÍøÉÏÊÕ¼¯ÁËIE7,6ÓëFireofxµÄ¼æÈÝÐÔ´¦Àí·½·¨²¢ÕûÀíÁËÒ»ÏÂ.¶ÔÓÚweb2.0µÄ¹ý¶È,Ç뾡Á¿ÓÃxhtml¸ñʽд´úÂë,¶øÇÒDOCTYPE Ó°Ïì CSS ´¦Àí,×÷ΪW3CµÄ±ê×¼,Ò»¶¨Òª¼Ó DOCTYPEÉùÃû.
CSS¼¼ÇÉ
1.divµÄ´¹Ö±¾ÓÖÐÎÊÌâ vertical-align:middle; ½«ÐоàÔö¼Óµ½ºÍÕû¸öDIVÒ»Ñù¸ß
line- ......
ÓÉÓÚ¸÷ä¯ÀÀÆ÷µÄĬÈÏCSSÑùʽ²»Ò»Ñù£¬ÎÒÃDZØÐëдһ¸öCSS ResetͳһÆðÀ´¡£
ͨ³£ÎÒµÄ×ö·¨ÊÇÔÚcommon.cssÀïдȫ¾Ö¿ØÖÆ£¬ÕâÀïÃæÒ²°üÀ¨headerºÍfooter£¬ÆäËüCSSÎļþ¾Íͨ¹ý@import url(”common.css”);ÒýÓá£
body{padding:10px;margin:0;background:#fff;font-size:12px;line-height:14px;color:#333;font-family:Ari ......