BlogJava-应用，一定要应用-随笔分类-css/层叠样式表http://www.blogjava.net/flyffa/category/16775.htmlzh-cnFri, 02 Mar 2007 06:23:08 GMTFri, 02 Mar 2007 06:23:08 GMT60【CSS】样式表中的类定义http://www.blogjava.net/flyffa/archive/2006/11/02/78653.htmlflyffaflyffaThu, 02 Nov 2006 05:14:00 GMThttp://www.blogjava.net/flyffa/archive/2006/11/02/78653.htmlhttp://www.blogjava.net/flyffa/comments/78653.htmlhttp://www.blogjava.net/flyffa/archive/2006/11/02/78653.html#Feedback5http://www.blogjava.net/flyffa/comments/commentRss/78653.htmlhttp://www.blogjava.net/flyffa/services/trackbacks/78653.html   最近做网页的时候无意中发现一个有意思的问题，只在Ie中测试过，不知道在firefox中有什么现象。
先定义样式表：
<STYLE>
DIV .head1
{
 background-color: yellow;
}

DIV.head2
{
 background-color: red;
}

</STYLE>


展现样式：

<div class="head1">div1</div>
<span class="head1">span1</span>
<div class="head2">div1</div>
<span class="head2">span1</span>

div1
span1
div1
span1

测试head1 与head2的区别

<div>
<div class="head1">div2</div>
<span class="head1">span2</span>
</div>

div2
span2

<p>
<div class="head1">div2</div>
<span class="head1">span2</span>
</p>

div2
span2




总结：
 head1样式和head2样式的主要区别就是中间多了一个空格。 感觉像是head1样式是指在div内部适用的样式； head2样式是应用于div元素上的样式；

另：由于博客上的编辑器自动在style之间增加了cdata角标，导致我的效果无法显示，head1的效果我是通过设置背景色完成的，有兴趣的朋友可以把那几段代码拷出来存成一个文件，就可以看到效果。

请高手指教。



flyffa 2006-11-02 13:14 发表评论
]]>【CSS】DIV内嵌浮动DIV时的问题http://www.blogjava.net/flyffa/archive/2006/11/01/78449.htmlflyffaflyffaWed, 01 Nov 2006 04:43:00 GMThttp://www.blogjava.net/flyffa/archive/2006/11/01/78449.htmlhttp://www.blogjava.net/flyffa/comments/78449.htmlhttp://www.blogjava.net/flyffa/archive/2006/11/01/78449.html#Feedback1http://www.blogjava.net/flyffa/comments/commentRss/78449.htmlhttp://www.blogjava.net/flyffa/services/trackbacks/78449.html
<div style="border-style:solid">
   <div style = "float:right;border-style:solid">dsfsdfsd<div>
</div>

发现内层div会越界，在网上找了一下：
<div style="border-style:solid">
   <div style = "float:right;border-style:solid">dsfsdfsd<div>
   <div style="font: 0px/0px sans-serif;clear: both;display: block">
</div>
加这么一句就好了，顺便查到了一个在firefox中解决的方法：
<div style="border-style:solid">
   <div style = "float:right;border-style:solid">dsfsdfsd<div>
   <br clear="alll">
</div>


flyffa 2006-11-01 12:43 发表评论
]]>