Css
深入理解CSS定位中的偏移
CSS有三种基本的布局机制：普通流、浮动和绝对定位。利用定位，可以准确地定义元素框相对于其正常位置应该出现的位置，或者相对于父元素、另一个元素甚至浏览器窗口本身的位置。但元素究竟如何定位，定位到什么位置，主要依靠top/right/bottom/left这四个偏移属性。本文就定位中的偏移做详细介绍 pos...
深入理解CSS元素可见性visibility
visibility属性常见于与display属性的比较中。但实际上，该属性有自己的一些有趣的用途。本文就visibility属性做详细整理和说明 定义visibility 值:visible|hidden|collapse|inherit 初始值:visible 应用于:所有元素 继承性:有&n...
CSS滚动条
滚动条在网页中经常见到，却并没有受到足够的重视。只有当因为滚动条的问题需要处理兼容性时，才进行调试操作。本文就滚动条的常见内容进行梳理 条件 滚动条和overflow是紧密相关的。只有当父级的overflow的值是auto或scroll，并且元素的内容超出元素区域时，才有可能出现滚动条 默认 ...
CSS拉伸resize
CSS3新增了resize属性，该属性允许用户通过拖动的方式来修改元素的尺寸。本来resize应该翻译为缩放，但在实际测试中通过resize属性只可以在宽高基础上实现拉伸效果，而无法实现缩放到小于宽高的效果。 [注意]IE浏览器不支持resize属性resize resize与overflow关系紧密，只有当元...
深入理解CSS溢出overflow
当一个元素固定为某个特定大小，但内容在元素中放不下。此时就可以利用overflow属性来控制这种情况 定义overflow溢出 值:visible|hidden|scroll|auto|inherit 初始值:visible 应用于:块级元素、替换元素、表单元格 继承性:无 [注意]除了IE7-...
CSS裁剪clip
CSS裁剪clip这个属性平时用的不多，但其实它并不是CSS3的新属性，很早就开始出现了。本文将介绍关于clip属性的相关知识 定义 一个绝对定位或固定定位元素通过使用属性clip可以改变剪裁区域的形状，但并不改变元素本身的宽高属性clip 值:rect(top,right,bottom,left)|...
CSS轮廓outline
轮廓outline处在边框边界的外面，它不像边框那样参与到文档流中，因此轮廓出现或消失时不会影响文档流，即不会导致文档的重新显示。利用轮廓，浏览器可以合并部分轮廓，创建一个连续但非矩形的形状。默认地，轮廓是一个动态样式，只有元素获取到焦点或被激活时呈现 [注意]IE7-浏览器不支持轮廓样式 与边框类似，轮廓最基...
CSS光标cursor
在浏览器中，光标对于提供交互反馈很有用。通过在不同的场景中改变光标，就能赋予其不同的含义 定义 cursor光标 值:[<uri>,]*[auto|default|pointer|crosshair|move|e-resize|ne-resize|nw-resize|n-resize|se...
CSS清浮动
人们经常谈起清浮动，其实就是解决浮动元素的包含块高度塌陷的问题 定义clear清除 值:left|right|both|none|inherit 初始值:none 应用于:块级元素(块级元素指block元素，不包括inline-block元素) 继承性:无left:左侧不允许存在浮动元素right...
深入理解CSS浮动
浮动最早的使用是出自<imgsrc="#"align="right">，用于文本环绕图片的排版处理。如今浮动作为CSS中常用的布局方式，本文将就浮动内容做详细介绍和梳理 定义float浮动 浮动元素脱离普通流，然后按照指定方向，向左或者向右移动，碰到父级边界或者另外一个浮动元素停止 值:...
深入理解CSS背景
背景和字体一样，是一个复合属性，而且它是一个使用频率很高的属性。在CSS3中，背景属性在保持以前用法的同时，增加了新的相关属性。本文将详细介绍关于背景的知识 背景颜色 背景色background接受所有合法的颜色，还可以接受一个使背景透明的关键字。关于颜色的设置请移步至此。背景颜色不能继承。其默认值是t...
CSS颜色模式转换器的实现
在CSS中，颜色的表示方式主要包括关键字、16进制、RGB模式、RGBA模式、HSL模式、HSLA模式。关于颜色模式的详细信息移步至此。本文就16进制、RGB模式及HSL模式的互相转换进行实现。 模式转换【1】16进制->RGB 16进制是设置颜色值的常用方式，将三个介于00-FF的十六进制数连接...
理解CSS前景色和透明度
颜色的出现让网页不再只是黑白，运用好颜色设计，能让网页增色不少。一个网页给人们留下的第一印象实际上就是它的整体颜色。关于如何设置颜色，请移步CSS的6种颜色模式。实际上，颜色的应用主要分为前景色、背景色和透明三个部分。本文主要介绍前景色和透明度。 color color前景色 值:<color&...
深入理解CSS六种颜色模式
赏心悦目的颜色搭配让人感到舒服，修改元素颜色的功能让人趋之若鹜。但颜色规划不当，会让网站用户无所适从。颜色从<fontcolor="">发展至今，保留了很多内容，也增加了新的内容，本文将介绍关于颜色模式的内容 以前主要采用关键字、16进制和RGB这三种设置颜色的方式。CSS3出现后，增加了...
CSS画出的图
矩形div{width:100px;height:100px;background-color:red;} 圆形div{width:100px;height:100px;background-color:red;border-radius:50%;} 椭圆【整个椭圆】div{width:100px;...
