cssÐÂÊÖÈëÃÅ½Ì³Ì ×ÝÏòÏÂÀ¼°¶à¼¶µ¯³öʽ²Ëµ¥
×¢ÒâÊÂÏ
ÁËʵÏÖµ¼º½ÖеÄ×Óµ¼º½ÓëÖ÷µ¼º½ÔÚʵÏÖÊó±ê½»»¥µÄͬʱ£¬±£³ÖÆäÏà¶ÔλÖÃÒ»Ö£¬ÎÒÃÇʹÓÃÁ˶Ôul li{}ʹÓÃÁËposition:relative;ʹÆä¶¨Î»·½Ê½×ªÎªÏà¶Ô¶¨Î»¡£¶ø¶Ôli ul{}¼´×Óµ¼º½²ÉÓÃÁËposition:absolute;Ïà¶ÔÓÚµ¼º½µÄ¾ø¶Ô¶¨Î»·½Ê½£¬ÁËÆäÊó±ê½»»¥ºóµÄλÖÃÒ»Ö¡£
×ÝÏòµ¼º½²Ëµ¥
ÎÒÃÇÏÈ¿´Ò»Ï´úÂë½á¹¹£º
<div id="nav">
<h1>CSS</h1>
<h2><a href="#">cssÈëÃÅ</a></h2>
<h2><a href="#">css½ø½×</a></h2>
<h2><a href="#">css¸ß¼¶</a></h2>
<h1>webUI</h1>
<h2><a href="#">ÀíÂÛ֪ʶ</a></h2>
<h2><a href="#">ʵսӦÓÃ</a></h2>
<h2><a href="#">¸ß¼¶¼¼ÇÉ</a></h2>
<h1>DOM</h1>
<h2><a href="#">DOMÈëÃÅ</a></h2>
<h2><a href="#">DOMÓ¦ÓÃ</a></h2>
<h2><a href="#">DOMÓëä¯ÀÀÆ÷</a></h2>
<h1>XHTML</h1>
<h2><a href="#">²Î¿¼ÊÖ²á</a></h2>
<h2><a href="#">½»Á÷ÂÛ̳</a></h2>
</div>
´ÓÒÔÉÏ¿ÉÒÔ¿´³ö£¬Õâ´ÎµÄXHTML²¿·ÖµÄ´úÂëºáÏò´úÂëÂÔÓв»Í¬£¬ÎÒÃÇûÓмÌÐøÊ¹ÓÃulºÍli±êÇ©£¬Æäʵ¼ÌÐøÊ¹ÓÃulÔªËØÒ²ÄÜÍêºÃµÄʵÏÖ×ÝÏòµ
Ïà¹ØÎĵµ£º
Ëĸöcss¹¤¾ß£ºfonts,grids,reset,base
Ê¹ÔªËØ±ê×¼»¯µÄreset.css
ÒÔÏÂÆÕͨ¶ø³£ÓõÄÔªËØ¶¼½«marginºÍpaddingÖµ±ê×¼»¯µ½0
the document body
div and p
ËùÓÐlist ÔªËØ£ºdl,dt,dd,ul,ol,li
±êÌâ¼¶ÔªËØ£ºh1,h2,h3,h4,h5,h6
preºÍblockquoteÔªËØ
ijЩ±íµ¥ÔªËØ£ºform,fieldset,input,textarea
tableÔªËØ£ºt ......
²»¿É»»ÐÐ <NOBR></NOBR> £¨²»»»ÐУ©
overflow
°æ±¾£ºCSS2¡¡ ¼æÈÝÐÔ£ºIE4+ NS6+¡¡¼Ì³ÐÐÔ£ºÎÞ
Óï·¨£º
overflow : visible | auto | hidden | scroll
²ÎÊý£º
visible : ¡¡²»¼ôÇÐÄÚÈÝÒ²²»Ìí¼Ó¹ö¶¯Ìõ¡£¼ÙÈçÏÔʽÉùÃ÷´ËĬÈÏÖµ£¬¶ÔÏ󽫱»¼ôÇÐΪ°üº¬¶Ô
ÏóµÄwindow»òf ......
¼ò½é¡¡¡¡
ʲôÊÇCSS hack(http://www.cssplay.org.cn/css-hack/index.html)ÓÉÓÚ²»Í¬µÄä¯ÀÀÆ÷£¬±ÈÈçInternet Explorer 6,Internet Explorer 7,Mozilla FirefoxµÈ£¬¶ÔCSSµÄ½âÎöÈÏʶ²»Ò»Ñù£¬Òò´Ë»áµ¼ÖÂÉú³ÉµÄÒ³ÃæÐ§¹û²»Ò»Ñù£¬µÃ²»µ½ÎÒÃÇËùÐèÒªµÄÒ³ÃæÐ§¹û¡£
¡¡¡¡Õâ¸öʱºòÎÒÃǾÍÐèÒªÕë¶Ô²»Í¬µÄä¯ÀÀÆ÷ ......
ÌṩһÖÖÓÃCSS´úÂëʵÏÖ×Ô¶¯½ØÈ¡×Ö·û´®µÄ·½·¨£º
CSS´úÂëÈçÏ£º
<style>
body{
background-color:#f4f4f4;
font-size:12px;
}
div.test{
width:200px;
height:100px;
border:1px solid red;
border-top:4px solid red;
padding:10px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
......
<html>
<head>
<mce:style type="text/css"><!--
div.container
{
width:100%;
margin:0px;
border:1px solid gray;
line-height:150%;
}
div.header,div.footer
{
padding:0.5em;
color:white;
background-color:gray;
clear:left;
}
h1.header
{
padding:0;
margin:0;
}
div. ......