CSSÔ²½Ç
½éÓÚ´¿´âCSSµÄÎÞͼƬԲ½ÇʵÔÚÊÇ´úÂëÌ«ÂÒ£¬»¹ÊÇÇãÏòÓÚÀûÓÃͼƬ½áºÏCSSÀ´×Ô×öÔ²½Ç£»
£¨1£©¸ß¿í½Ô×ÔÊÊÓ¦£º
.roundedcornr_box_510746 {
background: #dddddd url(roundedcornr_510746_grad.gif) repeat top left;width:300px;
}
.roundedcornr_top_510746 div {
background:transparent url(roundedcornr_510746_tl.gif) no-repeat top left;
}
.roundedcornr_top_510746 {
background:transparent url(roundedcornr_510746_tr.gif) no-repeat top right;
}
.roundedcornr_bottom_510746 div {
background:transparent url(roundedcornr_510746_bl.gif) no-repeat bottom left;
}
.roundedcornr_bottom_510746 {
background:transparent url(roundedcornr_510746_br.gif) no-repeat bottom right;
}
.roundedcornr_top_510746 div, .roundedcornr_top_510746,
.roundedcornr_bottom_510746 div, .roundedcornr_bottom_510746 {
width: 100%;
height: 30px;
font-size: 1px;
}
.roundedcornr_content_510746 { margin: 0 30px; }
-->
</style>
<div class="roundedcornr_box_510746">
<div class="roundedcornr_top_510746"><div></div></div>
<div class="roundedcornr_content_510746">
<h1>hello world</h1>
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt
ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris
nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur
&n
Ïà¹ØÎĵµ£º
1.idÑ¡ÔñÆ÷
idÑ¡ÔñÆ÷µÄÃüÃûÓ¦¼á³ÖÌåÏÖÎĵµµÄ½á¹¹ºÍλÖá£
Èç:#header¡¢#footer¡¢#left µÈ
2.classÑ¡ÔñÆ÷
classÑ¡ÔñÆ÷µÄÃüÃûÓ¦¸ÃÌåÏÖÃû³ÆµÄÑùʽÃèÊöÐÔ¡£
È磺.red¡¢.underline µÈ
3.¶ÔÓÚÄ£¿éµÄÍâΧ½á¹¹ÔªËØ×îºÃÓÃidÊôÐÔ£¬ÄÚ²¿ÔªËØ¿ÉÒÔ¶¨ÒåclassÊôÐÔ£¬
ÒòΪÍâΧµÄ½á¹¹Ò»°ãʽΨһµÄ¡£¶øÄÚ²¿µÄÔªËØ¿ÉÄÜ»á³öÏÖÖØ¸´¡£
ÁíÍ ......
1. ¼ì²éHTMLÔªËØÊÇ·ñÓÐÆ´Ð´´íÎó¡¢ÊÇ·ñÍü¼Ç½áÊø±ê¼Ç
¼´Ê¹ÊÇÀÏÊÖÒ²¾³£»áŪ´ídivµÄǶÌ×¹ØÏµ¡£¿ÉÒÔÓÃdreamweaverµÄÑéÖ¤¹¦Äܼì²éÒ»ÏÂÓÐÎÞ´íÎó¡£
2. ¼ì²éCSSÊÇ·ñÕýÈ·
¼ì²éÒ»ÏÂÓÐÎÞÆ´Ð´´íÎó¡¢ÊÇ·ñÍü¼Ç½áβµÄ } µÈ¡£¿ÉÒÔÀûÓÃCleanCSSÀ´¼ì²é CSSµÄƴд´íÎó¡£CleanCSS±¾ÊÇΪCSS¼õ·ÊµÄ
¹¤¾ß£¬µ«Ò²Äܼì²é³öƴд´íÎó¡£
3. È·¶¨´íÎó ......
1.positionµÄabsoluteÊôÐÔ±íʾ¸Ã¿éÒѾÍêÈ«ÍÑÀëÎı¾Á÷ÁË¡£Ò²¾ÍÊDz»ÔÙÕ¼ÓÿռäλÖÃ
¡£ÍêÈ«¿¿top,button,right,leftÀ´½øÐж¨Î»¡£
¡¡Õâ¸ö±ØÐëÄܹ»ÍêÈ«Àí½â¡£Í¬Ê±Îª¼õÉÙ´íÎóÔÚÉèÖÃabsoluteºó£¬Ò»¶¨ÖÁÉÙÖ¸¶¨top,buttom,right,leftÖеÄÒ»¸ö¡£
2.Èç¹û¿éÉèÖÃÁËabsoluteÊôÐÔ£¬Æä¶¨Î»µÄÔµãºÍ¸¸¿éµÄpositionÓйء£
¡¡Èç¹û¸¸¿éÉèÖà ......
ºÐ×Ó±êÇ©ºÍÊôÐÔ¶ÔÕÕ
CSSÓï·¨£¨²»Çø·Ö´óСд£©
JavaScriptÓï·¨£¨Çø·Ö´óСд£©
border
border
border-bottom
borderBottom
border-bottom-color
borderBottomColor
border-bottom-style
borderBottomStyle
border-bottom-width
borderBottomWidth
border-color
borderColor
border-left
borderLeft
border ......