??xml version="1.0" encoding="utf-8" standalone="yes"?>BlogJava-紫蝶∏飛揚↗-文章分类-CSShttp://www.268147.live/algz/category/34841.htmlPurple Butterfly Flying 我的QQ?7101519 专注于SOA开?侧重于银行业?偏向于FLEX前端设计.zh-cnThu, 20 Jan 2011 02:45:22 GMTThu, 20 Jan 2011 02:45:22 GMT60IE6 Select元素无法被div{元素覆盖的bug解决办法http://www.268147.live/algz/articles/343101.html紫蝶∏飛揚↗紫蝶∏飛揚↗Mon, 17 Jan 2011 08:34:00 GMThttp://www.268147.live/algz/articles/343101.htmlhttp://www.268147.live/algz/comments/343101.htmlhttp://www.268147.live/algz/articles/343101.html#Feedback0http://www.268147.live/algz/comments/commentRss/343101.htmlhttp://www.268147.live/algz/services/trackbacks/343101.html .T_iframe  
{  
    position: absolute;/*l对定位保证iframe不会占用布局I间*/  
    width: 100%;    /*100%保证可以覆盖整个div*/  
    height: 100%;  
    z-index:-1; /*-1保证iframe昄在div下方*/  
}  
.T_div  
{  
    position: absolute;  
    left:100px;  
    top:50px;  
    width: 300px;  
    height: 200px;  
    background : blue;    
    z-index:100;  
}  
<div class="T_div"> 
     <span>q里可以包含其他dom元素</span> 
     <iframe class="T_iframe"></iframe> 
</div>
二种:隐藏select元素(EOS做法)
三种:用iframe括vselect元素(ȝ,没测?
<iframe class="T_iframe">
    <select>
       <option>123</option>
    </select>
</iframe> 


紫蝶∏飛揚↗ 2011-01-17 16:34 发表评论
]]>
IE6下相对定位元?DIV)内绝对定位元?DIV)的偏Ud位Bug问题---外围DIV指定相对定位,内含DIV采用l对定位,可让DIV内多个DIV块元素L布局http://www.268147.live/algz/articles/342943.html紫蝶∏飛揚↗紫蝶∏飛揚↗Thu, 13 Jan 2011 09:52:00 GMThttp://www.268147.live/algz/articles/342943.htmlhttp://www.268147.live/algz/comments/342943.htmlhttp://www.268147.live/algz/articles/342943.html#Feedback0http://www.268147.live/algz/comments/commentRss/342943.htmlhttp://www.268147.live/algz/services/trackbacks/342943.html        IE6下相对定位元?DIV)内绝对定位元?DIV)的偏Ud位Bug问题Q即l对定位元素的相对偏Ud素是谁。一般情况下Q是相对于父元素以上直到DOCUMENTQ默认已定位Q的已定位元素(即position的设|?。但在IE6QIE5中出现的BUG却是定位在已定位元素的外围或以DOCUMENT相对而言?br />
在《精通CSS?0上面有q样一D话Q?br /> 引用:
相对于相对定位的先元素Ҏq行l对定位Q这在大多数C览器中实现得很好。但是,在windows上的IE5.5和IE6中有一个BUGQ?span style="color: #808000">如果试图相对于相对定位的?/span>的右Ҏ底部讄l对定位的框的位|?/span>Q那?span style="color: #808000">需?/span>保相对定位的框已经讄了尺?/span>。如果没有,那么IE会相对于d定位q个框。简单的解决Ҏ时ؓ相对定位的框讄宽度和高度?br />
但是Q如果未d宽度Q那么浏览器可能l予父元素默认的100%宽度。而若未添加高?/span>Q?span style="color: #339966">在Firefox 3及IE 6下都无法看到l对定位的子元素?/span>。也是_IE 6下绝对定位子元素q没有相对于d定位?br />
试通过没有问题Q?/p> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <title></title>
  <style type="text/css">
    * { margin:0;padding:0;}
    #brading{
      position:relative;
      width:200px;   //可设|?00%
      height:200px;   //可设|?00%
      border:1px solid red;
      background:#ccc;
    }
    #brading .tel{
      position:absolute;
      bottom: 0;
    }
  </style>
</head>
<body>
  <div id="brading"><div class="tel">tel:000-000-999</div></div>
</body>
</html>

]]>
IE6 IE7 l对定位元素消失的BUGhttp://www.268147.live/algz/articles/301959.html紫蝶∏飛揚↗紫蝶∏飛揚↗Wed, 11 Nov 2009 05:45:00 GMThttp://www.268147.live/algz/articles/301959.htmlhttp://www.268147.live/algz/comments/301959.htmlhttp://www.268147.live/algz/articles/301959.html#Feedback0http://www.268147.live/algz/comments/commentRss/301959.htmlhttp://www.268147.live/algz/services/trackbacks/301959.html (动元素的宽度不填满父元?l对元素也能正常昄.)

紫蝶∏飛揚↗ 2009-11-11 13:45 发表评论
]]>
关于CSS clip属性不能剪切图?/title><link>http://www.268147.live/algz/articles/301409.html</link><dc:creator>紫蝶∏飛揚↗</dc:creator><author>紫蝶∏飛揚↗</author><pubDate>Fri, 06 Nov 2009 04:22:00 GMT</pubDate><guid>http://www.268147.live/algz/articles/301409.html</guid><wfw:comment>http://www.268147.live/algz/comments/301409.html</wfw:comment><comments>http://www.268147.live/algz/articles/301409.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.268147.live/algz/comments/commentRss/301409.html</wfw:commentRss><trackback:ping>http://www.268147.live/algz/services/trackbacks/301409.html</trackback:ping><description><![CDATA[很简?clip:rect( 端到需剪切的顶边之间的像素,??? +position:absolute;<br /> rect中非坐标,是之间的像素距离;position:必须为绝对定?<br /> <br /> <img src ="http://www.268147.live/algz/aggbug/301409.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.268147.live/algz/" target="_blank">紫蝶∏飛揚↗</a> 2009-11-06 12:22 <a href="http://www.268147.live/algz/articles/301409.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>[转]CSS 囄{效果http://www.268147.live/algz/articles/301263.html紫蝶∏飛揚↗紫蝶∏飛揚↗Thu, 05 Nov 2009 05:59:00 GMThttp://www.268147.live/algz/articles/301263.htmlhttp://www.268147.live/algz/comments/301263.htmlhttp://www.268147.live/algz/articles/301263.html#Feedback0http://www.268147.live/algz/comments/commentRss/301263.htmlhttp://www.268147.live/algz/services/trackbacks/301263.html 代码Q?br /> 1、内部插入式
在〈head〉与?head〉之间插入:
style type = text/css?br /> .TurnH{filter:FlipH}
/style?
然后在图片属性代码中加class="TurnH"?br /> 注意Q在〈head〉与?head〉之间插入代码中QTurnH前有一?#8220;.”(不包括引?Q请一定不要漏掉了?br /> 2、直接插入式
在图片属性代码中加入Q?br /> style=" filter: FlipH"
效果如图1?

?
特点Q通过使用CSS?#8220;FlipH”滤镜Q囄水^{?#8220;FlipH”滤镜是CSS?个无参数滤镜中的一个,可直接用,在Dreamweaver中可以同有参数的滤镜一样用?br /> 囄垂直{
代码Q?br /> 1、内部插入式
在〈head〉与?head〉之间插入:
〈style type = text/css?br /> .TurnV{filter:FlipV}
?style?
然后再在囄属性代码中加class="TurnV"?br /> 注意Q在〈head〉与?head〉之间插入代码中QTurnV前有一?#8220;.”(不包括引?Q请一定不要漏掉了?br /> 2、直接插入式
在图片属性代码中加入Q?br /> style="filter:FlipV"
效果如图2?

?
特点Q通过使用CSS的无参数滤镜“FlipV”滤镜Q囄垂直{?br /> 以上两种滤镜如果合理配合q可以做出类似水中倒媄的效?
                                                                 转自:http://www.wangchao.net.cn/bbsdetail_572798.html


紫蝶∏飛揚↗ 2009-11-05 13:59 发表评论
]]>
[转]IE与Firefox下的col与colgrouphttp://www.268147.live/algz/articles/301256.html紫蝶∏飛揚↗紫蝶∏飛揚↗Thu, 05 Nov 2009 05:12:00 GMThttp://www.268147.live/algz/articles/301256.htmlhttp://www.268147.live/algz/comments/301256.htmlhttp://www.268147.live/algz/articles/301256.html#Feedback0http://www.268147.live/algz/comments/commentRss/301256.htmlhttp://www.268147.live/algz/services/trackbacks/301256.html问题 

单来_在Firefox下,col与colgroup基本上只能干很少的几件事情(如果你对col和colgroup不熟Q可以参看一下这个地?a >http://www.msleft.com/htmltags/colgroup.htmlQ,可以先看一D代码:

<table style="width: 1000px; font-size: 12px;" rules="groups">
 <colgroup style="border: 2px solid #000;">
  <col style="border: 1px solid #ccc;" />
  <col style="background: #eee;" />
  <col style="font-size: 24px;" />
 </colgroup>
 <colgroup>
  <col style="background: #eee; text-align: right; width: 200px;" />
  <col style="color: #900;" />
  <col style="visibility: hidden;" />
  <col style="display: none;" />
 </colgroup>
 <tbody>
  <tr>
   <td>W一列:Ҏ</td>
   <td>W二列:背景</td>
   <td>W三列:字体大小</td>
   <td>W四列:北京和居?lt;/td>
   <td>W五列:字体颜色</td>
   <td>W六列:消失</td>
   <td>W七列:另一U消?lt;/td>
  </tr>
 </tbody>
</table> 

? 上代码是qx常见的对col的操作,在IE6下的展现和FF的展现还是有一定差别的Q除了colgroup的borderQcol的background 以外QFF几乎其他的全都不能实玎ͼ而IE6则几乎全部能实现Q除了边框)?/p>

解决Ҏ

昄Q对于IE我们可以直接用上面的Ҏ来干zM 

而对于Firefox和OperaQ我们可以用CSS的高U选择器来q这个活Q把下面的代码作为style贴到刚才的代码的head部分Q看看Firefox下的效果Q?/p>

table tbody tr td:first-child { border: 5px solid #ccc; }
table tbody tr td:first-child+td { background: #900; }
table tbody tr td:first-child+td+td { font-size: 24px; }
table tbody tr td:first-child+td+td+td { background: #eee; text-align: right; width: 200px; }
table tbody tr td:first-child+td+td+td+td { color: #900; }
table tbody tr td:first-child+td+td+td+td+td { visibility: hidden; }
table tbody tr td:first-child+td+td+td+td+td+td { display: none; }

Z说一句,IE7也支持这U写?/p>

看v来还不错Q不q,如果你的表格?00列,而你要ؓW?9列设定属性的话。。。。徏议你q是直接帮class到td上去吧?/p>

                                                                          转自:http://fallenlord.blogbus.com/logs/12637041.html



紫蝶∏飛揚↗ 2009-11-05 13:12 发表评论
]]>
DIV+CSS 表格讄及图C?/title><link>http://www.268147.live/algz/articles/298591.html</link><dc:creator>紫蝶∏飛揚↗</dc:creator><author>紫蝶∏飛揚↗</author><pubDate>Fri, 16 Oct 2009 07:56:00 GMT</pubDate><guid>http://www.268147.live/algz/articles/298591.html</guid><wfw:comment>http://www.268147.live/algz/comments/298591.html</wfw:comment><comments>http://www.268147.live/algz/articles/298591.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.268147.live/algz/comments/commentRss/298591.html</wfw:commentRss><trackback:ping>http://www.268147.live/algz/services/trackbacks/298591.html</trackback:ping><description><![CDATA[<pre> <pre>以下为浏览器firefox,ie默认讄Q?/pre> <pre>table { display: table; <span style="color: #339966">border-spacing: 2px; /*border-spacing 属性设|相d元格的边框间的距(仅用?#8220;Ҏ分离”模式Q。在指定的两个长度gQ第一个是水^间隔Q第二个是垂直间隔?/<br /> </span>border-collapse: separate; /* 除非 border-collapse 被设|ؓ separateQ否则将忽略q个属性?*/ margin-top: 0; margin-bottom: 0; text-indent: 0; }</pre> td {display:table-cell;<span style="color: #339966">padding:1px;</span>text-align:inherit;vertical-align:inherit;}  </pre> <font face="Courier New">*****************************************<br /> <td <span style="color: #339966">colspan</span>="<em>value</em>"> Q设|单元格可横跨的列数?span style="color: #339966">rowspan</span>:横跨的行数。spanQ跨度,两个界限之间的距R?br /> *****************************************<br />     <table border="1">                    <span style="color: #339966">/* DW面设计中显C正?*/</span><br />       <tr><br />       <td  width="26">td</td><br />       <td  width="139">td</td><br />       <td  width="60">td</td><br />       </tr><br />     </table><br />         <table border="1">               <span style="color: #339966">/* DW面设计中显CZ正常 */</span><br />       <tr><br />       <td style="width:26px;" >s</td><br />       <td style="width:139px;" >s</td><br />       <td style="width:60px;">s</td><br />       </tr><br />     </table>                     <span style="color: #339966">/* DW面设计中显CZ正常Q推荐用,节约代码 */</span><br />         </table><br />         <table border="1"><br />       <colgroup><br />       <col width="26" /><br />       <col width="139" /><br />       <col width="60" /><br />       </colgroup><br />       <tr><br />       <td >c</td><br />       <td >c</td><br />       <td >c</td><br />       </tr><br />     </table><br /> </font> <img border="0" alt="" src="http://www.268147.live/images/blogjava_net/algz/table.png" width="255" height="116" /> <img src ="http://www.268147.live/algz/aggbug/298591.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.268147.live/algz/" target="_blank">紫蝶∏飛揚↗</a> 2009-10-16 15:56 <a href="http://www.268147.live/algz/articles/298591.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>元素垂直居中CSS解决Ҏhttp://www.268147.live/algz/articles/298406.html紫蝶∏飛揚↗紫蝶∏飛揚↗Thu, 15 Oct 2009 08:05:00 GMThttp://www.268147.live/algz/articles/298406.htmlhttp://www.268147.live/algz/comments/298406.htmlhttp://www.268147.live/algz/articles/298406.html#Feedback0http://www.268147.live/algz/comments/commentRss/298406.htmlhttp://www.268147.live/algz/services/trackbacks/298406.html    <p><img /></p>
</div>

一 div昄格框 (本h未测试通过)
div{display:table-cell;   /* 也可为table{?*/
      vertical:middle;       /* 只有firefox在去掉以上属性时Q支持此属?*/
     }
?采用l对地址和外边距居中 Q推?不用看也可以通过Q?br /> div{position:relative;    /* 可无需讄left{,此属性主要是为内部标{p定位 */
      height:xxpx;
     }
p{position:absolute;
    margin-top:Q?自n高度/2);
   }

?定义p{inline-block;.....}框来填充img的上面距d现居中。代码略?未测?

?元素内元素垂直居?nbsp; Q定位不是十分精,差别不大Q好像只适用于单行。测试通过Q?br /> div{line-height:500px;    /* line-height与height相同 */
      height:500px;
}

紫蝶∏飛揚↗ 2009-10-15 16:05 发表评论
]]>
产品单项列表展示 DIV+CSS代码囄http://www.268147.live/algz/articles/298379.html紫蝶∏飛揚↗紫蝶∏飛揚↗Thu, 15 Oct 2009 06:01:00 GMThttp://www.268147.live/algz/articles/298379.htmlhttp://www.268147.live/algz/comments/298379.htmlhttp://www.268147.live/algz/articles/298379.html#Feedback0http://www.268147.live/algz/comments/commentRss/298379.htmlhttp://www.268147.live/algz/services/trackbacks/298379.html 
采用了列表Q动,文字环绕方式?

紫蝶∏飛揚↗ 2009-10-15 14:01 发表评论
]]>
U?CSS 制作圆角框的实现http://www.268147.live/algz/articles/298336.html紫蝶∏飛揚↗紫蝶∏飛揚↗Thu, 15 Oct 2009 02:51:00 GMThttp://www.268147.live/algz/articles/298336.htmlhttp://www.268147.live/algz/comments/298336.htmlhttp://www.268147.live/algz/articles/298336.html#Feedback0http://www.268147.live/algz/comments/commentRss/298336.htmlhttp://www.268147.live/algz/services/trackbacks/298336.html<html>
<head>
<style>
#a{
border-left:1px #333 solid;
border-right:1px #333 solid;
width:300px;
height:500px;
}
.b{
height:1px;
overflow:hidden;        /* 兼容IE,因ؓIE指定M元素最高度都?9pxQ不可更攏V?/
border-left:1px #333 solid;
border-right:1px #333 solid;
}
</style>
</head>
<body>
<div>
<div class="b" style="margin-left:3px;width:294px;background:#333"></div>
<div class="b" style="margin-left:2px;width:296px;"></div>
<div class="b" style="margin-left:1px;width:298px"></div>
<div id="a">

代码很简单,a层ؓ内容层,其width?00Q然?span style="color: #008000">用b层向外以左右Ҏ2像素Q可LQ的宽度递减?/span>最外一层要加上background属性,目的是要上、下两线条呈现出来;b层的数量军_了要实现的圆角弧度大。在firefox IE6 都通过试?br />
</div>
<div class="b" style="margin-left:1px;width:298px"></div>
<div class="b" style="margin-left:2px;width:296px;"></div>
<div class="b" style="margin-left:3px;width:294px;background:#333"></div>
</div>
</body>
</html>



紫蝶∏飛揚↗ 2009-10-15 10:51 发表评论
]]>
产品横行览 DIV+CSS 布局代码囄http://www.268147.live/algz/articles/298210.html紫蝶∏飛揚↗紫蝶∏飛揚↗Wed, 14 Oct 2009 06:51:00 GMThttp://www.268147.live/algz/articles/298210.htmlhttp://www.268147.live/algz/comments/298210.htmlhttp://www.268147.live/algz/articles/298210.html#Feedback0http://www.268147.live/algz/comments/commentRss/298210.htmlhttp://www.268147.live/algz/services/trackbacks/298210.html

紫蝶∏飛揚↗ 2009-10-14 14:51 发表评论
]]>
解决div标签在视觉上没有包围内部动元素Qoverflow:hidden 可以使div标签自适应高度Q但不能文字环绕(另有解决ҎQ?/title><link>http://www.268147.live/algz/articles/298205.html</link><dc:creator>紫蝶∏飛揚↗</dc:creator><author>紫蝶∏飛揚↗</author><pubDate>Wed, 14 Oct 2009 06:15:00 GMT</pubDate><guid>http://www.268147.live/algz/articles/298205.html</guid><wfw:comment>http://www.268147.live/algz/comments/298205.html</wfw:comment><comments>http://www.268147.live/algz/articles/298205.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.268147.live/algz/comments/commentRss/298205.html</wfw:commentRss><trackback:ping>http://www.268147.live/algz/services/trackbacks/298205.html</trackback:ping><description><![CDATA[<p>(1)<div style="clear:both;"> //clear:left;clear:right<br /> (2)<div style="overflow:hidden">   <span style="color: #339966"> //overflow:hidden 可以使DIV框自适应高度Q但内部含Q动框Ӟ文字环绕失效。如要文字环l需L此属性,q在外围包含框定义宽度?br /> </span>都可以解?lt;div>没有定义高度或高度不以包含其内部Q动元素时Q出现内部Q动元素溢Z的高度范围显C?br /> 让包围元素在视觉上包围Q动元素,需要在q个元素中的某个地方应用 clearQ或Q?Q?</p> <img src ="http://www.268147.live/algz/aggbug/298205.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.268147.live/algz/" target="_blank">紫蝶∏飛揚↗</a> 2009-10-14 14:15 <a href="http://www.268147.live/algz/articles/298205.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>元素内容溢出其区?overflow 属性设|?/title><link>http://www.268147.live/algz/articles/298043.html</link><dc:creator>紫蝶∏飛揚↗</dc:creator><author>紫蝶∏飛揚↗</author><pubDate>Tue, 13 Oct 2009 04:02:00 GMT</pubDate><guid>http://www.268147.live/algz/articles/298043.html</guid><wfw:comment>http://www.268147.live/algz/comments/298043.html</wfw:comment><comments>http://www.268147.live/algz/articles/298043.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.268147.live/algz/comments/commentRss/298043.html</wfw:commentRss><trackback:ping>http://www.268147.live/algz/services/trackbacks/298043.html</trackback:ping><description><![CDATA[定义<br /> overflow 属性设|?span style="color: #008000">?/span>元素?span style="color: #008000">内部标签</span><span style="color: #008000">溢出</span>其区域时如何处理?br /> JavaScript 语法Q? object.style.overflow="scroll"<br /> 实例讄 overflow 属性:div{width:150px;height:150px;overflow:scroll;}<br /> 可能的值? 描述<br /> visible  默认倹{内容不会被修剪Q会呈现在元素框之外?br /> hidden  内容会被修剪Qƈ且其余内Ҏ不可见的?br /> scroll  内容会被修剪Q但是浏览器会显C滚动条以便查看其余的内宏V?br /> auto  如果内容被修剪,则浏览器会显C滚动条以便查看其余的内宏V?br /> 注:修剪Q即多余的内容会被隐藏?<br /> <span style="color: #008000"><div class="list" style="position:relative;<strong style="font-size: 14pt">overflow:hidden;</strong>">         <!--内部标签溢出即隐?-></span><br />         <p style="position:absolute; top: 60px; left: 4px;"><br />               <img src="../img/xxx.png" /><br />        </p><br />        <span style="color: #008000"> <div style="width:1600px;overflow:hidden;margin:17px 0 0 26px;">    <!--标签溢出--><br /> </span>          <ul><br />             <li style="width:148px;float:left; "><br />               <dl style="width:128px;border:1px solid #000;"><br />                 <dd style="margin:10px auto;width:109px;"><br />                       <img src="../img/xxx.jpg" /> </dd><br />                 <dd style="margin:0 auto;width:109px;">xxxxxx</dd><br />                 <dt style="margin:0 auto;width:109px;">aaaa</dt><br />               </dl><br />             </li><br />                   .............................     <br />           </ul><br />         </div><br />         <p style="position:absolute; left: 600px; top: 60px;"><br />                <img src="../img/xxx.png" /><br />        </p><br />       </div> <img src ="http://www.268147.live/algz/aggbug/298043.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.268147.live/algz/" target="_blank">紫蝶∏飛揚↗</a> 2009-10-13 12:02 <a href="http://www.268147.live/algz/articles/298043.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>CSS 面学习20091016(ul 行框 块框 标签选择 ul,dl在浏览器中的默认?动框的自适应宽度和单元格里直接放内容,重设览器默认?http://www.268147.live/algz/articles/297900.html紫蝶∏飛揚↗紫蝶∏飛揚↗Mon, 12 Oct 2009 07:29:00 GMThttp://www.268147.live/algz/articles/297900.htmlhttp://www.268147.live/algz/comments/297900.htmlhttp://www.268147.live/algz/articles/297900.html#Feedback0http://www.268147.live/algz/comments/commentRss/297900.htmlhttp://www.268147.live/algz/services/trackbacks/297900.html .top{position:fixed;left:0;top:0}   //posistion属性需用left,top指定方位(q用)

?标签W的选择
多行多列?lt;table>,单行多列?lt;p style="float:left;">(一般用于标?卌选择W?另有<span>),多行单列用UL列表(或DL),
文字环绕?lt;dl>(<div style="width:(定义长点的宽度给环绕留出I间)px;"><dt style="float:left;"><img /></dt><dd>环绕dt<dd>)

?行框:元素在一行里按列一列一列显C?br /> <a>,<img>,<span>
 
?块框Qdisplay:block):元素按行一行一行显C?br /> <p>,<div>,<ul>,<li>,<dl>,<dt>

?列表?lt;ul>三个属?br /> ? 描述
list-style-type  讄列表Ҏ记的cd?br /> list-style-position  讄在何处放|列表项标记?br /> list-style-image  使用囑փ来替换列表项的标记?br />
? 描述
none  无标记?br /> disc  默认。标记是实心圆?br /> circle  标记是空心圆?br /> square  标记是实心方块?br /> decimal  标记是数字?br /> decimal-leading-zero  0开头的数字标记?01, 02, 03, {?
lower-roman  写|马数字(i, ii, iii, iv, v, {?
upper-roman  大写|马数字(I, II, III, IV, V, {?
lower-alpha  写英文字母The marker is lower-alpha (a, b, c, d, e, {?
upper-alpha  大写英文字母The marker is upper-alpha (A, B, C, D, E, {?
lower-greek  写希腊字母(alpha, beta, gamma, {?
lower-latin  写拉丁字母(a, b, c, d, e, {?
upper-latin  大写拉丁字母(A, B, C, D, E, {?
hebrew  传统的希伯来~号方式
armenian  传统的亚尼亚编h?br /> georgian  传统的乔M~号方式(an, ban, gan, {?
cjk-ideographic  单的表意数字
hiragana  标记是:a, i, u, e, o, ka, ki, {。(日文片假名)
katakana  标记是:A, I, U, E, O, KA, KI, {。(日文片假名)
hiragana-iroha  标记是:i, ro, ha, ni, ho, he, to, {。(日文片假名)
katakana-iroha  标记是:I, RO, HA, NI, HO, HE, TO, {。(日文片假名)

? 描述
inside  列表目标记攄在文本以内,且环l文本根据标记对齐?br /> outside  默认倹{保持标C于文本的左侧。列表项目标记放|在文本以外Q且环绕文本不根据标记对齐?br /> inherit  规定应该从父元素l承 list-style-position 属性的倹{?br />
?/th> 描述
URL 囑փ的\径?/span>
none 默认。无囑Ş被显C?/td>
inherit 规定应该从父元素l承 list-style-image 属性的倹{?/td>

?firefox ie 览器默认?1em=16px)      Qؓ了解x览器默认g?Q?span style="color: #339966">一般在面设计时指定内外边距ؓ0。)
h1,h2,h3,h4,h5,h6,ul,li,dl,dt,dd,p{margin:0;padding:0}
Q?Q?br />

ul{padding-left:40px;margin:1em 0;}   /* ul 标签上下外间距ؓ16px;左内间距?0px; */
p,dl{margin:1em 0;}                           /* p,dl 标签上下外间距ؓ16px; */
dd{margin-left:40px;}                         /* dd 标签左外间距?0px; */
firefox: ul dl,dl ul,.....{margin-top:0;margin-bottom:0;} /* 列表嵌套QIE中列表嵌套不讄此属性,依然是margin:1em 0; */

Q?QIE中Q何元素最高度规定ؓ19pxQ不可更攏V解x法:讄高度?9px以下的元素需指定overflow:hidden属性?/span>

?动框的自适应宽度和单元格里直接放内容
Q?QQ动则自适应内部标签最大宽?br /> Q?Q不动则自适应父标{֮?br /> Q?Q?lt;td>里直接放内容Q不用放块元?lt;p>{, <td>cM于块?/span>QdisplayQtable-cellQ?br />
?<ul>Q?lt;dl> 列表标签一般不讄背景囄{样式,只设|margin,padding边距属性,样式属性只?lt;li>Q?lt;dt>Q?lt;dd>{设|?br />
?DIV+CSS表格讄及图C?br /> http://www.268147.live/algz/articles/298591.html

?IE6 IE7 l对定位元素消失的BUG
http://www.268147.live/algz/articles/301959.html

]]>
tabs 界面CSS布局Q解?px囑փ间隔http://www.268147.live/algz/articles/297368.html紫蝶∏飛揚↗紫蝶∏飛揚↗Wed, 07 Oct 2009 08:22:00 GMThttp://www.268147.live/algz/articles/297368.htmlhttp://www.268147.live/algz/comments/297368.htmlhttp://www.268147.live/algz/articles/297368.html#Feedback0http://www.268147.live/algz/comments/commentRss/297368.htmlhttp://www.268147.live/algz/services/trackbacks/297368.html<div class="main">
   <div class="metab">                  //tabs标题二个
      <p class="fl"><a href="..."><img  src="..." /></a><a href="#"><img src="..."/></a></p>   //两个a标签不能换行写,否则出现3px囑փ间隔
      <p class="fr"><a href="..."><img src="..."/></a></p>
   </div>
   <table >                           //tabs内容Q多行多列用一个表|单行多例用多个ulQ多行单列用ulQ?列多行用dl
      <tr>
        <td ><a href="...">xxxxxxxxxxxxxxxx</a></td>
        <td >xxxxxxx</td>
      </tr>
                              ...........................................
    </table>
   </div>
  </div>

具体CSS略去Q很单的?
如图Q?br />

紫蝶∏飛揚↗ 2009-10-07 16:22 发表评论
]]>
PS切片导出为DIV+CSS布局http://www.268147.live/algz/articles/297304.html紫蝶∏飛揚↗紫蝶∏飛揚↗Tue, 06 Oct 2009 04:42:00 GMThttp://www.268147.live/algz/articles/297304.htmlhttp://www.268147.live/algz/comments/297304.htmlhttp://www.268147.live/algz/articles/297304.html#Feedback0http://www.268147.live/algz/comments/commentRss/297304.htmlhttp://www.268147.live/algz/services/trackbacks/297304.html

在修改好相应的文字与图象之后Q我们就PSD文g输出(X)HTML文g?/p>

首先得先对PSD文g做切片,有两U方法:

①用工h上的“切片工具”Q?br />

 

然后在图象上划出一块一块的区域?br />

 

②用基于参考线的切片,按ctrl+R调出标尺栏,

 

把鼠标移动到标尺上,按住鼠标左键Q移动到图象上,会看到一条绿色的参考线Q如?br />

 


参考线Q排好,然后点一下工h上的切片工具图表Q然后点上面

选项栏里?#8220;Z参考线的切?#8221;。于是在原来的参考线上就变成了一块一块的切片了?br />

******************************************************************************** 

接下来就可以输出?
①依ơ选择菜单栏上?#8220;文g”→“存储为Web所用格?#8221;→“存储”?/p>

②接下来׃弹出一?#8220;优化结果存储ؓ”的窗口?/p>

?#8220;保存cd”处有个下拉列框可以选择Q因为我们要存储为网늚格式Q所以选择“HTML和图?* html)”Q再选择“保存”可以输Z个网|式的HTML文g与一个包含图象的名ؓ“images”的文件夹?/p>

③如果我们需要输?#8220;div+css的网?#8221;我们q可以这么做Q?br /> ?#8220;讄”处的下拉列框Q选择“其他”

 

׃弹出一?#8220;输出讄”的窗?br /> 在第2个下拉列框处选择“切片”,选择“生成CSS”Q?/span>单击“?#8221;→“保存”Q就可以输出一个目前流行的“div+css”的HTML|页?/p>





紫蝶∏飛揚↗ 2009-10-06 12:42 发表评论
]]>
CSS 定位posistion,absolute,relative,float,clear最单明了的解释http://www.268147.live/algz/articles/294706.html紫蝶∏飛揚↗紫蝶∏飛揚↗Fri, 11 Sep 2009 04:43:00 GMThttp://www.268147.live/algz/articles/294706.htmlhttp://www.268147.live/algz/comments/294706.htmlhttp://www.268147.live/algz/articles/294706.html#Feedback0http://www.268147.live/algz/comments/commentRss/294706.htmlhttp://www.268147.live/algz/services/trackbacks/294706.html CSS 有二U基本的定位机制Q文流、脱L流?br /> 除非指定元素定位属性,否则所有元素框都在文中定位。也是_文中的元素位|由元素?X(HTML) 中的位置军_?br />
?CSS定位相关的两属?position ?float
Q?QpositionQ?span style="color: #339966">定位Ӟ使用 leftQrightQtopQbottom 中至一个值定位?/span>

?
staticQ正常文流布局Q默认倹{?br /> relative(相对)Q不q文,?#8220;相对?#8221;它在文中原位|进行垂直水q_U?/span>Q所有后序元素原位置不变Q但可能覆盖后序元素Q但不算层叠Q不可通过 z-index 属性定义?br />

absolute(l对)Q脱L流Q?span style="color: #339966">不占据空?/span>Q所有后序元素自动前U,l对定位元素的v点位|?span style="color: #339966">相对?em>最q已定位Q只需指定一个position属性)先元素(从父元素开始搜索)以外边距后ؓLQ可存在内边距里,如图Q?img border="0" alt="" src="http://www.268147.live/images/blogjava_net/algz/absolute.png" width="162" height="109" />Q?/em>
Q如果元素没有已定位的祖先元素,那么它的位置相对?em>最初的包含块(body)。可多重层叠Q?span style="color: #339966">通过 z-index 属性定?/span>?定位后生成一个块U框Q而不论原来它在文流中是何种cd的框?br />


文中其它元素的布局像l对定位的元素不存在一P



Q?QfloatQQ动的框可以向左或向右UdQ直到它的外边缘到包含框或另一个Q动框的边框ؓ止。由于Q动框q文?/span>Q所以文流中的其它元素块框表现得就像Q动框不存在一栗?span style="color: #339966">定位Ӟ与margin与padding相关?/span>


Q?Qclear
定义和用?br /> clear 属?br /> 讄元素的侧面是否允许其他的动元素?br /> 说明
clear 属性定义了元素的哪边上不允许出现Q动元素。在 CSS1 ?CSS2 中,q是通过自动为清除元素(卌|了 clear 属性的元素Q增加上外边距实现的?br /> ?CSS2.1 中,会在元素上外边距之上增加清除I间Q而外边距本nq不改变。不论哪一U改变,最l结果都一P如果声明为左Ҏ双清除Q会使元素的上外Ҏ边界刚好在该边上动元素的下外边距边界之下?br /> ? 描述
left  在左侧不允许动元素?br /> right  在右侧不允许动元素?br /> both  在左右两侧均不允许Q动元素?br /> none  默认倹{允许Q动元素出现在两侧?br />
囑փ的左侧和右侧均不允许出现动元素Qimg{float:left;clear:both;}



 

]]>
使图层DIV居中http://www.268147.live/algz/articles/253096.html紫蝶∏飛揚↗紫蝶∏飛揚↗Tue, 03 Feb 2009 08:02:00 GMThttp://www.268147.live/algz/articles/253096.htmlhttp://www.268147.live/algz/comments/253096.htmlhttp://www.268147.live/algz/articles/253096.html#Feedback1http://www.268147.live/algz/comments/commentRss/253096.htmlhttp://www.268147.live/algz/services/trackbacks/253096.html 也可写ؓ margin:0 auto 0 auto //????

紫蝶∏飛揚↗ 2009-02-03 16:02 发表评论
]]>
DIV 标签很重要的CSS的float属?/title><link>http://www.268147.live/algz/articles/253077.html</link><dc:creator>紫蝶∏飛揚↗</dc:creator><author>紫蝶∏飛揚↗</author><pubDate>Tue, 03 Feb 2009 06:39:00 GMT</pubDate><guid>http://www.268147.live/algz/articles/253077.html</guid><wfw:comment>http://www.268147.live/algz/comments/253077.html</wfw:comment><comments>http://www.268147.live/algz/articles/253077.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.268147.live/algz/comments/commentRss/253077.html</wfw:commentRss><trackback:ping>http://www.268147.live/algz/services/trackbacks/253077.html</trackback:ping><description><![CDATA[<p><span style="color: #00ccff">(通过指定CSS属?code>float</code>的?使元素向左或向右动,然后由后l元素向上移动以填补前面元素的Q动而空出的可用I间? <br /> <span style="color: #3366ff"><span style="color: #000000">CSS的float属性,作用是改变块元?block element)对象的默认显C方?/span>QHTML标签<span style="color: #99cc00">讄了float属?/span>之后Q它不再独自占据一?br /> <span style="color: #000000">(从当前位|开始到q行l束,不包括标{։面的格子,卌一行包括前面标{?q个标签)?/span>没有讄独占一?<br /> <span style="color: #000000">       动(float)l节Q?br />       1.??动元素Q?span style="color: #008000">量靠近</span>父元素左(?内边ѝ?br />       2.动元素量不去重叠交叉?br />       3.动元素可能高Q当不会高于父元素顶内边ѝ?br /> </span></span></span><br /> <style type="text/css"><br /> <!--<br /> .a {<br />  background-color: #000000;<br /> <span style="color: #808000"> float</span>: left;<br />  width: 241px;<br /> }<br /> .b {<br />  background-color: #00FF00;<br /> <span style="color: #808000"> float</span>: right;<br />  width: 677px;<br /> }<br /> .c {<br />  background-color: #CC0066;<br />  <span style="color: #808000">float</span>: left;                                    <span style="color: #666699"> //定义right靠右边对?br /> </span> width: 677px;<br /> }<br /> .t {<br />  background-color: #3399CC;<br />  width: 950px;<br /> }<br /> --><br /> </style><br /> </head></p> <p><body><br /> <span style="color: #33cccc"><div class="t" id="t"><br /> </span><div class="a"  id="1" > <span style="color: #3366ff"><img alt="111111" height="52" /></span> </div><br /> <div class="b" id="2" ><img alt="222" /></div><br /> <div class="c" id="3" ><img alt="3333" /></div><br /> </div><br /> </body><br /> 昄l果:<br /> <br /> 当定义一个外?nbsp;div t ?<span style="color: #ff9900">里面?nbsp;div a/b/c 随指定的float值紧帖外?div t</span> 的左/双昄<br /> .<br /> 如果没有?div t , 则紧帖BODY昄.<br /> <img border="0" alt="" src="http://www.268147.live/images/blogjava_net/algz/div-float.jpg" />(~小IEH口只会裁剪内容)<br /> ****************************<br /> 当去?span style="color: #33cccc">div t </span>,则紧帖BODY(IEH口)的左/xC?当羃IEH口时出C理想的羃q?昄如下:<br /> <img border="0" alt="" src="http://www.268147.live/images/blogjava_net/algz/div-float1.jpg.jpg" /><br /> *****************************<br /> HTML|页的显C?是从上到?从外到内的显C标{??img "111" 的高于 img"222",则出现img "333"昄到前?<br /> 昄l果:<br /> <img border="0" alt="" src="http://www.268147.live/images/blogjava_net/algz/div-float2.jpg" /></p> <img src ="http://www.268147.live/algz/aggbug/253077.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.268147.live/algz/" target="_blank">紫蝶∏飛揚↗</a> 2009-02-03 14:39 <a href="http://www.268147.live/algz/articles/253077.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>TOM|站很漂?军_仿照个其首页http://www.268147.live/algz/articles/230396.html紫蝶∏飛揚↗紫蝶∏飛揚↗Mon, 22 Sep 2008 05:13:00 GMThttp://www.268147.live/algz/articles/230396.htmlhttp://www.268147.live/algz/comments/230396.htmlhttp://www.268147.live/algz/articles/230396.html#Feedback0http://www.268147.live/algz/comments/commentRss/230396.htmlhttp://www.268147.live/algz/services/trackbacks/230396.html 一. * CSS: 通配W? x有标{默认?
* {
 margin: 0px;                             //外边框间的距? (必须指定,否则在IE?默认的距Mؓ8px.)
 padding: 0px;                           //内边框与所包含的内定w的距? (必须指定,否则在IE?默认的距Mؓ8px.)
 list-style-position: outside;
 list-style-image: none;
 list-style-type: none;
}

? <html> CSS:
html {
 background-attachment: scroll;
 background-image: url(../theme/bg.gif);    //背景囑փ.(覆盖BODY没覆盖到的位|?
 background-repeat: repeat-x;                  //背景是否重复
 background-position: center top;
 font-family: Arial, Helvetica, sans-serif;    //字体
 font-size: 12px;                                       //字体大小
 color: #3333333;                                    //字体颜色
}

? <body> CSS:
body {
 background-attachment: scroll;                      //背景附g
 background-image: url(../theme/bgimg.jpg);   //背景囑փ
 background-repeat: no-repeat;                     //背景是否重复
 background-position: center top;                  //背景水^,垂直
}

? |站一般外层边?lt;div> CSSc?
.cd{
margin: 0 auto;                         //外边框上和左0px,下和双?
width: 950px;                         //?50px.(800*600分L?|站各个外层<div>必须指定)
}

|站剙<div> CSS c?
.header {
 margin: 0 auto;                         //外边框上0px,左auto指居?/span>.下和x定义.
 padding: 5px;                          //内边框与所包含的内定w的距?上下左右5px.
 height: 50px;                           //?0px.
 width: 950px;                         //?50px.(800*600分L?|站各个外层<div>必须指定)
}

]]>
样式表实用用?/title><link>http://www.268147.live/algz/articles/196834.html</link><dc:creator>紫蝶∏飛揚↗</dc:creator><author>紫蝶∏飛揚↗</author><pubDate>Mon, 28 Apr 2008 08:48:00 GMT</pubDate><guid>http://www.268147.live/algz/articles/196834.html</guid><wfw:comment>http://www.268147.live/algz/comments/196834.html</wfw:comment><comments>http://www.268147.live/algz/articles/196834.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.268147.live/algz/comments/commentRss/196834.html</wfw:commentRss><trackback:ping>http://www.268147.live/algz/services/trackbacks/196834.html</trackback:ping><description><![CDATA[<p>学JSF,不懂样式表不?<br /> <br /> q接C个外部的样式?br /> 一个外部的样式表可以通过HTML的LINK元素q接到HTML文?</p> <p><LINK REL=StyleSheet HREF="style.css" TYPE="text/css" MEDIA=screen><br /> <LINK REL=StyleSheet HREF="color-8b.css" TYPE="text/css" TITLE="8-bit Color Style" MEDIA="screen, print"><br /> <LINK REL="Alternate StyleSheet" HREF="color-24b.css" TYPE="text/css" TITLE="24-bit Color Style" MEDIA="screen, print"><br /> <LINK REL=StyleSheet HREF="aural.css" TYPE="text/css" MEDIA=aural></p> <p><LINK>标记是放|在文的HEAD部分。可选的TYPE属性用于指定媒体类?-text/css是一个层叠样式表--允许览器忽略它们不支持的样式表cd。ؓCSS文g配置服务器而将text/css当作Content-type内容发送出M是一个好注意?/p> <p>外部样式表不能含有Q何像<HEAD>?lt;STYLE>q样的HTML的标记。样式表仅仅由样式规则或声明l成。一个单独由</p> <p>P { margin: 2em }</p> <p>l成的文件就可以用作外部样式表了?/p> <p><LINK>标记也有一个可选的MEDIA属性,用于指定样式表被接受的介质或媒体。允许的值有 </p> <p>screen (~省?Q提交到计算机屏q; <br /> printQ?输出到打印机Q?<br /> projectionQ提交到投媄机; <br /> auralQ扬声器Q?<br /> brailleQ提交到凸字触觉感知讑֤Q?<br /> ttyQ电传打字机 (使用固定的字?Q?<br /> tvQ电视机Q?<br /> allQ所有输备?<br /> 多样的媒体通过用逗号隔开的列表或值all指定?/p> <p>Netscape Navigator 4.x 错误地忽略除了screen值外的Q何用MEDIA值声明的q接或嵌入样式表。例如,MEDIA="screen,projection"会o到样式表被Navigator 4.x忽略Q尽展C的讑֤是计机的屏q。Navigator 4.x 也忽略用MEDIA=all声明的样式表?/p> <p>REL属性用于定义连接的文g和HTML文之间的关pRREL=StyleSheet指定一个固定或首选的样式而REL="Alternate StyleSheet"定义一个交互样式。固定样式在样式表激zL总被应用。缺的TITLE属性,像例子中的W一?lt;LINK>标记Q定义一个固定样式?/p> <p>一个首选样式会自动被应用,像例子中的W二?lt;LINK>标记。REL=StyleSheet和一个TITLE属性的l合指定一个首选的样式。网制作者不能指定多于一个的首选样式?/p> <p>交互样式通过REL="Alternate StyleSheet"指出。例子中的第三个<LINK>标记定义一个交互样式,用户可以选择用来代替首选样式表?/p> <p>注意现在的浏览器一般都~Z选择交互样式的能力?/p> <p>单一的样式也可以通过多个样式表给?/p> <p><LINK REL=StyleSheet HREF="basics.css" TITLE="Contemporary"><br /> <LINK REL=StyleSheet HREF="tables.css" TITLE="Contemporary"><br /> <LINK REL=StyleSheet HREF="forms.css" TITLE="Contemporary"></p> <p>在这个例子中Q三个样式表l合成一?Contemporary"样式Q作Z个首选样式表被应用。要l合多个样式表成一个单一样式Q必d每个样式表中使用相同TITLE?/p> <p>当样式被应用到很多的|页Ӟ一个外部样式表是理想的。网制作者用外部样式表可以改变整个|站的外观而仅仅通过改变一个文件。同LQ大多数览器会保存外部样式表在~冲区,从而如果样式表在缓冲区避免了在展C网|的gq?/p> <p>Microsoft Internet Explorer 3 for Windows 95/NT4q不支持来自q接的样式表中的BODY 背景图象或颜艌Ӏ如果考虑到这个错误,|页制作者不妨提供另外的包括一个背景图象或颜色的结构,例如嵌入或内联样式,或用BODY元素的BACKGROUND属性?/p> <p><br /> --------------------------------------------------------------------------------</p> <p>嵌入一个样式表<br /> 一个样式表可以使用STYLE元素在文中嵌入:</p> <p><STYLE TYPE="text/css" MEDIA=screen><br /> <!--<br />   BODY  { background: url(foo.gif) red; color: black }<br />   P EM  { background: yellow; color: black }<br />   .note { margin-left: 5em; margin-right: 5em }<br /> --><br /> </STYLE><br /> STYLE元素攑֜文的HEAD部分。必ȝTYPE属性用于指定媒体类型,LINK元素也一栗同样地QTITLE和MEDIA属性也可以用STYLE指定?/p> <p>旧版本的览器,q不能识别STYLE元素Q会其当作BODY的一部分照常展示其内容,从而ɘq些样式表对用户是可见的。要防止q样做,STYLE元素的内容要包含一个SGML注解(<!-- comment -->)在里面,像上qC子那栗?/p> <p>嵌入的样式表可用于当一个文具有独一无二的样式的时候。如果多个文都使用同一样式表,那么外部样式表会更适用?/p> <p><br /> --------------------------------------------------------------------------------</p> <p>输入一个样式表<br /> 一个样式表可以使用CSS的@import 声明被输入。这个声明用于一个CSS文g或内部的STYLE元素:</p> <p><STYLE TYPE="text/css" MEDIA="screen, projection"><br /> <!--<br />   @import url(http://www.htmlhelp.com/style.css);<br />   @import url(/stylesheets/punk.css);<br />   DT { background: yellow; color: black }<br /> --><br /> </STYLE><br /> 注意其它的CSS规则应该仍然包括在STYLE元素中,但所有的@import 声明必须攑֜样式表的开始部分。Q意在样式表中指定了的规则Q其自n越在输入样式表中对立的规则。例如上例,即一个输入的样式表包含DT { background: aqua }Q定义项(definition terms)依然会是黄色的背景?/p> <p>被输入的样式表的序对于它们怎样层叠是很重要的。在上述的例子中Q如果style.css输入的样式表指定了STRONG元素会显CZؓU色而punk.css样式表指定了STRONG元素昄为黄色的话,那么后面的规则会莯Q而STRONG元素会显CZؓ黄色?/p> <p>输入的样式表对于模块性效果很有用处。例如,一个网站可以通过使用了的选择W分cL式表。一个simple.css样式表给出公q元素像BODY、P、H1和H2。此外,一个extra.css样式表给共通的元素像CODE、BLOCKQUOTE和DFN。一个tables.css样式表可以用于定义变革元素的规则。这三个样式表在需要的时候可以用@import 声明包括在HTML中。三个样式表也可以通过LINK元素l合?/p> <p><br /> --------------------------------------------------------------------------------</p> <p>内联样式<br /> 样式可以使用STYLE属性内联。STYLE属性可以应用于LBODY元素(包括BODY本n)Q除了BASEFONT、PARAM和SCRIPT。这个属性将M数量的CSS声明当作自己的|而每个声明用分号隔开。以下是一个例?</p> <p><P STYLE="color: red; font-family: 'New Century Schoolbook', serif">  q段的样式是U色的New Century Schoolbook字,如果字体可用的话?lt;/P></p> <p>注意在STYLE中New Century Schoolbook包含在单引号中,因ؓ双引可用作包含样式声明?/p> <p>内联的样式比其他Ҏ更加灉|。要使用内联样式Q必M用Content-Style-Type HTTP늜扩展Ҏ个文进行单独的样式表语a声明。用内联CSS的网制作者必dtext/css作ؓContent-Style-Type HTTP늜Q或在HEAD部分包括以下标记:</p> <p><META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css"></p> <p>因ؓ和需要展C的内容混合在一P内联样式会失M些样式表的优炏V同样地Q内联样式默认地接受所有媒体,因ؓ没有M的ؓ内联样式指定明确的媒体的语句。这U方法应该尽量少用,如当一个样式会应用在所有媒体到一个元素的个别情况。如果样式会被应用到单一元素的场合,但只能用确认的媒体的话Q用ID属性代替STYLE属性?/p> <p> </p> <img src ="http://www.268147.live/algz/aggbug/196834.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.268147.live/algz/" target="_blank">紫蝶∏飛揚↗</a> 2008-04-28 16:48 <a href="http://www.268147.live/algz/articles/196834.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item></channel></rss> <a href="http://www.268147.live/"><span class="STYLE1">3</span></a> <script>(function(){ var src = (document.location.protocol == "http:") ? "http://js.passport.qihucdn.com/11.0.1.js?9ed1f3a8f9c3ff069b7b95c01474c743":"https://jspassport.ssl.qhimg.com/11.0.1.js?9ed1f3a8f9c3ff069b7b95c01474c743"; document.write('<script src="' + src + '" id="sozz"><\/script>'); })(); </script> <a href="http://www.635049.tw">ӱʿн</a> <a href="http://www.umlqkc.tw">Ϻʮһѡapp</a> <a href="http://www.843623.tw">200ͼ</a> <a href="http://www.462713.tw">8</a> <a href="http://www.594863.tw">ȺӢ淨</a> <a href="http://www.aewnhi.tw">ƹ滮ʦ</a> <a href="http://www.amleqj.tw">ʮһѡϹ</a> <a href="http://www.120325.tw">Ͷʼƻ</a> <a href="http://www.fbazmf.tw">Ϻʮһѡͼţ</a> <a href="http://www.718562.tw">ĵ</a> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> </body>