wangjingyi

overflow 属性规定当内容溢出元素框时发生的事情。所有主流浏览器都支持。  <div class="a"> <div class="a-left">我是A浮动在左边</div> <div class="a-right">我是B浮动在右边</div> </div&am

[size=medium][b]什么是css sprites？[/b][/size]通过将多个图片融合到一副图里面，然后通过CSS的一些技术布局到网页上。实际上是通过所谓的“切割”，然后再通过CSS的定位技术{“background-image”，“background-repeat”，“background-position”的组合进行背景定位，background-position可以...

text-transform 属性处理文本的大小写。这个属性值有 4 个：none 默认状态uppercase 将文本转换为全大写lowercase 将文本转换为全小写capitalize 对每个单词的首字母大写[code="css"].upper {text-transform:uppercase;}.lower {text-transform:lowercase...

具体的区别是：[size=large][b]1）起源的差别：[/b][/size]link属于XHTML标签，而@import完全是CSS提供的一种方式。 [size=large][b]2）[color=red]加载顺序[/color]的差别：[/b][/size]link是html加载前就引用，而import是html加载后才引用。例:采用impor引用，会先显示无样...

max-height 设置元素的最大高度。元素可以比指定值矮，但不能比其高。min-height 设置元素的最小高度。元素可以比指定值高，但不能比其矮。[不包括外边距、边框和内边距]最大最小高度样式使用非常方便，满足固定高度弊端，但现在IE6却不支持，IE7及以上浏览器和其它浏览器均支持。[code="html"] 最小高度为60px ...

z-index 属性用来设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。 ** 元素可拥有负的 z-index 属性值。 ** 仅能在[color=red][b]定位元素[/b][/color]上奏效（例如 position:absolute;）！设置一个定位元素沿 z 轴的位置，z 轴定义为垂直延伸到显示区的轴。如果为正数，则离用户更近，为负...

[size=medium][b]CSS Reset[/b][/size] 因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没对CSS初始化往往会出现浏览器之间的页面显示差异。把浏览器提供的默认样式覆盖掉就是CSS reset，统一定义保证了不同浏览器能产生相同的显示效果。 当然，初始化样式会对SEO(Search Engine Optimizatio...

[size=large][color=red]:before 伪元素在元素之前添加内容。 :after 伪元素在元素之后添加内容。 [/color][/size]这两个伪元素允许创作人员在元素内容的最前面或者最后面插入生成内容。 默认行内元素，可以使用属性 display 改变。 【需要与content属性一起使用，为源文档中不存在的内容设置样式的】 [code="html...

告诉渲染引擎工作时如何优化显示文本。浏览器会在渲染速度、易读性（清晰度）和几何精度方面做一个权衡。是一个SVG-可缩放矢量图形（Scalable Vector Graphics）属性，目前尚没有任何的CSS标准对其进行定 义。语法： [code="css"]text-rendering: auto | optimizeSpeed | optimizeLegibility | geome...

[url]http://www.w3cschool.cn/pr_text_text-indent.html[/url]规定文本块中首行文本的缩进。[code="html"]这是段落中的一些文本。这是段落中的一些文本。这是段落中的一些文本。这是段落中的一些文本。这是段落中的一些文本。这是段落中的一些文本。这是段落中的一些文本。这是段落中的一些文本。这是...

CSS样式表继承指的是，特定的CSS属性向下传递到子孙元素。[b]可继承的样式[/b]：红色为文本相关属性，蓝色为列表相关属性。 azimuth, border-collapse, border-spacing, caption-side, color, cursor, direction, elevation, empty-cells,[color=red]...

[size=large][b]LESS CSS是什么？[/b][/size] 一种动态样式语言，属于CSS预处理语言的一种。[size=large][b]LESS 原理[/b][/size] LESS 包含一套自定义的语法及一个解析器，用户根据这些语法定义自己的样式规则，这些规则最终会通过解析器（如koala），编译生成对应的 CSS 文件。在现有 CSS 语法的基础上，为...

两种后缀名文件： 一种后缀名为sass，不使用大括号和分号； 一种是scss文件，和平时写的css文件格式差不多，使用大括号和分号。sass 在线工具 [url]http://sassmeister.com/[/url][code="css"]//文件后缀名为sass的语法p background: #0982c1//文件后缀名为scss的语法 p...

[url]http://www.wufangbo.com/css-jin-zhi-xuan-ze/[/url]user-select有两个值： none：用户不能选择文本 text：用户可以选择文本注意：user-select不是一个W3C的CSS标准属性，浏览器支持的不完整，需要对每种浏览器进行调整。[code="css"]body{ -moz-u...

页面结构如下：[code="html"] 1) Content here. 2) nav part here. 3) extra part here. [/code] 左边区域是定宽的，右边和下边不定宽：[code="css"]#wrapper{float:left;width:100%;} #cont...

github上源码：[url]https://github.com/necolas/normalize.css[/url][size=large][b]是什么？[/b][/size] 是一种CSS reset的替代方案[size=large][b]用处[/b][/size] 保护有用的浏览器默认样式而不是完全去掉它们 一般化的样式：为大部分HTML...

[si在文档类型定义（DTD）中对不同的元素规定了不同的类型，从[color=green]元素本身的特点[/color]来讲，可以分为替换(repalced elements)和不可替换元素(non-replaced elements)。 ●替换元素 -- 浏览器根据元素的标签和属性，来决定元素的具体显示内容。 eg：、、、、。没有实际内容，是空元素。 eg:浏...

[code="html"] header 1) Content here. 2) right part here. 3) left part here. footer [/code]1:2:1固定宽度布局：[code="css"]body {text-align:center;display:bl...

[size=large]CSS hack:[/size]由于不同厂商的流览器或某浏览器的不同版本（如IE6-IE11,Firefox/Safari/Opera/Chrome等），对CSS的支持、解析不一样，导致在不同浏览器的环境中呈现出不一致的页面展现效果。为了获得统一的页面效果，针对不同的浏览器或不同版本写特定的CSS样式，把这个针对不同的浏览器/不同版本写相应的CSS code的过程，叫做CS...

绿色 / √ 表示目前支持。橙色/ Δ 表示浏览器部分支持当前CSS选择器。红色/ Χ 表示浏览器完全不支持。[img]http://dl.iteye.com/upload/attachment/0064/5114/abcc14fa-5c69-35d3-88f6-eeffcc937d47.png[/img]...

[size=x-large][b]三种基本选择器：[/b][/size][b]类型选择器[/b]：以文档语言对象类型作为选择符，匹配指定的元素。[code="java"]p {color：red；}[/code][b]类选择器[/b]：用点号（.）表示，根元素的class属性值来指定元素。[code="java"].note { font-size:14px; } /*所有cl...

一般情况下，选择器越特殊，它的优先级越高。也就是选择器指向的越准确，它的优先级就越高。通常我们用1表示类型选择器的优先级，用10表示类选择器的优先级，用100标示ID选择器的优先级。 css的优先级包含四组级别（文内选择符，ID选择符，Class选择符，元素选择符）以及各级别出现的次数。根据a、b、c、d四种等级出现的次数计算为依据确定CSS选择器的优先级。如果样式是行内...

用CSS来排版网页，即用DIV编排网页结构，由此会接触到一个知识点----[b][size=xx-large]CSS的盒子模式[/size][/b]。盒子模式具备的属性：内容(content)、填充(padding)、边框(border)、边界(margin)[img]http://dl.iteye.com/upload/attachment/0064/6930/09e708f0-...

高效的CSS就是让浏览器在查找style匹配的元素的时候尽量进行少的查找。1 不要在ID选择器前使用标签名一般写法：DIV#divBox更好写法：#divBox解释： 因为ID选择器是唯一的，加上div反而增加不必要的匹配。2 不要再class选择器前使用标签名一般写法：span.red更好写法：.red解释：同第一条，但如果你定义了多个.red，而且在不同的元素下...

额，css基础真的很差，被鄙视了。很基础的面试常用，简单记录下吧：  visibility：设置元素是否可见。 display：设置元素如何显示。注意：通过样式文件或<style>css</style>方式来设置元素的display:none样式，用js设置style.display=""并不能使元素显示，可以使用block或inline等值来代...

 浮动 float 属性：定义元素在哪个方向浮动。float：left  | right |  none                       浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。外边距 margin属性：百分数是相对于父元素的 width 计算的。 页面div：  <div id="container"&g...

        标签class属性定义两个类名时，该标签会被添加上两个class对应的css样式，如果两个类相互冲突又怎么解决呢？相对在CSS文件中后面定义的样式具有较高优先级，而不是根据标签中定义的类名先后顺序来确定样式优先级。举例：.m1{background-color: gray;}.m2{background-color: blue;} <div...

1.内联元素和块级元素的关系：任何不是块级元素的可见元素都是内联元素，使用display：block将行内元素转换成块元素。2.内联元素和块级元素的区别：1）[size=large]块级元素：[/size]一般都从新行开始，它可以容纳内联元素和其他块元素。注：[color=brown]标签不可以嵌套[/color]可以通过css更改块级元素的浮动方式，改变页面的布局。每...

ie下对图片进行旋转：rotation的几个值： 0 不旋转（默认值） 1 90度 2 180度 3 270度注意:在现在的网页布局中，往往是在div上附加滤镜的，如果单单的在html代码里面给div设置一个id，这样子滤镜是不会有作用的，必须要在style或者css中定义这个id属性(仅仅定义一个宽或者高就行了)，否则不会起作用。 [code=...

谈到CSS的定位机制时都会提到一个关键词“文档流”。那么什么是文档流呢？将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素,即为[size=x-large]文档流[/size]。 CSS的定位机制有3种：[color=blue]普通流、浮动（float：left/right/none）和定位 （position:static/relative/absol...

line-height 属性设置行间的距离（行高）。*不允许使用负值。[code="css"]p.small {line-height: 0.5}p.big {line-height: 2}[/code][code="html"]这是拥有标准行高的段落。默认行高大约是 1。这是拥有标准行高的段落。这个段落拥有更小的行高。这个段落拥有更小的...

opacity：设置元素的不透明级别。opacity:value|inherit; 规定不透明度，从 0.0 （完全透明）到 1.0（完全不透明）。所有浏览器都支持 opacity 属性。div#MyDIV {opacity:1;}[img]http://dl2.iteye.com/upload/attachment/0105/3072/0612203f-c319-3...

[size=large]1.标签内的CSS。[/size][code="css"]测试信息[/code][size=large]2.网页内的CSS。[/size][code="css"]div{margin: 0;padding: 0;border:1px red solid;}[/code][size=large]3.link引用的CSS。[/size][code="...

1）添加额外标签在浮动元素末尾添加一个空的标签例如 ，其他标签br等亦可。弊端：不得不增加无意的代码[code="java"].main{float:left;}.side{float:right;}//或者：.footer[/code]2）父元素设置 overflow：hidden[code="java"].main{float:left;}....

[code="java"]/*iPhone 6 Portrait*/@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation : portrait) { }/*iPhone 6 landscape*/@media only screen an...