CSS - 随笔分类(第2页) - losesea

css样式表之冲突与继承

摘要：根据顺序、具体性原则。当一个HTML元素被多个样式选择器定义并产生冲突的时候，其权重（优先级）排序如下：id>class>Multi HTML Tag>Single HTML Tag另外需要注意的一点是：内联样式（style＝“”）的优先级别最高，但现在一般不直接定义某个元素的内联样式。阅读全文

posted @ 2013-04-15 13:16 losesea 阅读(847) 评论(0) 推荐(0)

position属性absolute与relative 详解

摘要：一.解读absolute与relative http://www.blueidea.com/tech/web/2006/4249.asp很多朋友问过我absolute与relative怎么区分，怎么用？我们都知道absolute是绝对定位，relative是相对定位，但是这个绝对与相对是什么意思呢？绝对是什么地方的绝对，相对又是相对于什么地方而言的呢？那他们又有什么样的特性，可以做出什么样的效果呢？关于两者之间又有什么样的技巧呢？下面我们就来一一解读。Absolute，CSS中的写法是：position:absolute; 他的意思是绝对定位，他是参照浏览器的左上角，配合TOP、RIGHT、B 阅读全文

posted @ 2013-04-11 19:57 losesea 阅读(277) 评论(0) 推荐(0)

css解决span宽度问题

摘要：在本次修改模板过程中，span宽度问题始终困扰着我ie7下好了，ie6下又出问题。因为我是菜鸟，经过百度+google后发现，在css2的标准中，查阅关于width的定义，原来css中的width属性并不总是有效的，如果对象是inline对象，width属性就会被忽略。Firefox和IE都遵循了这个标准。下面代码的css定义完美解决了span的宽度设置问题。由于浏览器通常对不支持的css属性采取忽略处理的态度，所以最好将display:inline-block行写在后面，这样在Firefox里面，如果到了未来的Firefox 3，这一行就能起作用，代码可以同时兼容各种版本。<!DOCT 阅读全文

posted @ 2013-04-11 11:05 losesea 阅读(337) 评论(0) 推荐(0)

火狐浏览器和IE的CSS区别

摘要：你对IE和火狐浏览器的CSS区别是否熟悉，这里和大家一起探讨一下，相信本文介绍一定会让你有所收获。IE和火狐浏览器的CSS区别1、IE6.0的div的内嵌div可以把父级的高度撑大，而FireFox不可以，要自己设置高度。2、当设置为三列布局时，IE6.0的float宽度不能达到100％，而FireFox可以。当设置为两列布局时，两种浏览器都可以。3、在火狐浏览器中，非float的div前面有同一父级的float的div，此div若有背景图，要使用clear：both，才能显示背景图，而IE6.0中不用使用clear：both。4、在[text-decoration:underline]的属性阅读全文

posted @ 2013-04-10 13:42 losesea 阅读(2032) 评论(1) 推荐(0)

CSS outline:none

摘要：当元素获得焦点的时候，焦点框为0.比如说当前这个网页，你用tab键切换的时候，文字链接、搜索框、按钮等的外面会有一个虚线框（或高亮框），此时当前的元素就获得了焦点，你可以对它进行操作。这个功能一般是为使用键盘操作的用户准备的。有些链接——比如一个图片链接，你不想让他出现虚线框破坏设计感，就可以用此方法。建议一般不要去掉，只在一些影响设计美感的地方用。毕竟这个焦点框对键盘用户是很有帮助的。定义和用法outline-style 属性用于设置元素的整个轮廓的样式。样式不能是 none，否则轮廓不会出现。outline （轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。out 阅读全文

posted @ 2013-03-31 02:45 losesea 阅读(7836) 评论(0) 推荐(0)

IE6里DIV错位的问题

摘要：采用”FLOAT：LEFT“的DIV在IE8、IE7、都没问题，IE6下却向下移动，出现空白。这是因为，IE6采用的内核默认把DIV之间的距离增加了3~5个PX，所以，试试是将下移的DIV的STYLE里增加"margin-left:-5px;"或者更小。阅读全文

posted @ 2013-03-27 12:24 losesea 阅读(343) 评论(0) 推荐(0)

二十款漂亮的CSS字体样式，让你受用非浅

摘要：平时对于网站整站的字体风格常常很纠结，纠结到底用什么样式才行，才好看，后来在网上搜集收到二十种我认为很漂亮的字体样式并使用，感觉很美观，解决了我以前的纠结。具体二十种漂亮样式如下：样式一：body{margin:0;padding:0;line-height:1.5em;font-family:"TimesNewRoman",Times,serif;font-size:14px;color:#000000;background:#f2e7caurl(images/templatemo_body.jpg)topcenterno-repeat;}样式二：body{backgro 阅读全文

posted @ 2013-03-26 14:34 losesea 阅读(5920) 评论(0) 推荐(0)

display属性值:

摘要：display属性值:none 此元素不会被显示。 block 此元素将显示为块级元素，此元素前后会带有换行符。 inline 默认。此元素会被显示为内联元素，元素前后没有换行符。 inline-block 行内块元素。（CSS2.1 新增的值） list-item 此元素会作为列表显示。 run-in 此元素会根据上下文作为块级元素或内联元素显示。 compact CSS 中有值 compact，不过由于缺乏广泛支持，已经从 CSS2.1 中删除。 marker CSS 中有值 marker，不过由于缺乏广泛支持，已经从 CSS2.1 中删除。 table 此元素会作为块级表格来显示（类似阅读全文

posted @ 2013-03-21 11:55 losesea 阅读(199) 评论(0) 推荐(0)

[转]IE6双倍边距——IE布局BUG集锦

摘要：前言：IE6双倍边距这个问题其实早在学习CSS之初都已经知道如何解决，但当时只知道如何解决而并不知道引起这个BUG的原因是什么，再接下来工作过程中不断实践也终于明白是怎么回事了。但最近开发项目逐渐转移到以IE7为IE的基础参考标准后，逐渐有点淡忘IE6下的一些诡异BUG的解决方案了，就是知道如何解决也忘了部分理论知识了。看来还是脑子不够用啊，索性上网把所有的IE6BUG 都收集整理下，作为我可怜的大脑的外挂硬盘储备。1、问题：在IE6下如果某个标签使用了float属性，同时设置了其外补丁“margin:10px 0 0 10px”可以看出，上边距和左边距同样为10px，但第一个对象距左边有20 阅读全文

posted @ 2013-03-14 13:16 losesea 阅读(241) 评论(0) 推荐(0)

用CSS设置多个背景、背景渐变、指定背景大小

摘要：CSS设置多个背景阅读全文

posted @ 2013-02-03 03:57 losesea 阅读(6176) 评论(0) 推荐(0)

使用css的类名交集复合选择器

摘要：.class1.class2 阅读全文

posted @ 2013-02-02 23:48 losesea 阅读(311) 评论(0) 推荐(0)

height、clientHeight、scrollHeight、offsetHeight区别

摘要：长宽的问题阅读全文

posted @ 2013-01-30 19:40 losesea 阅读(233) 评论(0) 推荐(0)

CSS的兼容与选择

摘要：大于号阅读全文