html5之css
关注
分享
扫一扫
文章平均质量分 63
ruoshui0914
这个作者很懒，什么都没留下…
展开
-
css代码规范
CSS 样式书写规范可能不同团队都有各自的规范，又或者很多人在写 CSS 的时候还是想到什么就写什么，不存在太多的约束。我觉得 CSS 代码规范还是有存在的必要的，尤其是在团队配合，多人协作下，规范就显得尤为重要。本文的所列是实践当中得出的一套比较不错的 CSS 书写规范，并不希望大家完全采用，而是可以结合自己的团队需要，发展出一套适合自己的 CSS 代码规原创 2017-07-13 16:03:35 · 497 阅读 · 0 评论 -
01 CSS-选择器
CSS基础选择器标签选择器：所有标签名都可以当做选择器，比如body、h1、dl、ul、span等等id选择器： 同一个页面内id不能重复（一般是JS中用ID选择器）类选择器：任何的标签都可以携带class属性，class属性可以重复（CSS尽量用类选择器）CSS高级选择器后代选择器：空格表示。选择的是后代，不一定是儿子交集选择器：选择的元素是同时满足两个条件,一般都是以标原创 2017-07-13 14:13:14 · 525 阅读 · 0 评论 -
08 CSS-隐藏盒子的5种方法
display:none;隐藏盒子，而且不占位置。(用的最多)overflow:hidden;隐藏盒子超出的部分opacity:0;隐藏盒子，而且占位置。visibility:hidden;隐藏盒子，而且占位置。Position/top/left/…-999px 隐藏盒子，而且占位置。补充：1.第三种opacity:0;将透明图变为0来隐藏盒子 该方法IE8 以及更早的原创 2017-07-13 14:26:06 · 3027 阅读 · 0 评论 -
07 CSS-相对定位、绝对定位、固定定位、z-index
定位有三种，分别是相对定位、绝对定位、固定定位。1、相对定位：position:relative; 2、绝对定位：position:absolute; 3、固定定位：position:fixed; 4、关于z-index1、相对定位：position:relative;1.1相对定位介绍相对定位，就是微调元素位置的。让元素相对自己原来的位置，进行位置原创 2017-07-13 14:25:06 · 364 阅读 · 0 评论 -
05 CSS-浏览器兼容问题小总结（IE6）
IE6不支持小于12px的盒子IE6不支持用overflow:hidden;来清除浮动IE6双倍margin bugIE6的3px bug第一IE6不支持小于12px的盒子，任何小于12px的盒子，在IE6中看都大 解决办法很简单，就是将盒子的字号，设置小（小于盒子的高），比如0px。 height: 4px; _font-size: 0px;原创 2017-07-13 14:23:08 · 179 阅读 · 0 评论 -
04 CSS-浮动和清除浮动的三种方法
浮动的性质：脱标、贴边、字围、收缩。浮动浮动的性质：脱标、贴边、字围、收缩。脱标：脱离标准文档流情况一：绿色盒子float:left;蓝色盒子没有float； 绿色盒子脱离了标准文档流，所以蓝色盒子就是现在标准文档流中的第一个盒子。所以就渲染在了左上方。情况二： 一个span标签不需要转成块级元素，就能够设置宽度、高度了。 所原创 2017-07-13 14:22:15 · 312 阅读 · 0 评论 -
03 CSS-盒模型和标准文档流(行内元素和块级元素)
盒模型一个盒子中主要的属性就5个：width、height、padding、border、margin。width是“宽度”的意思，CSS中width指的是内容的宽度，而不是盒子的宽度。height是“高度”的意思，CSS中height指的是内容的高度，而不是盒子的高度padding是“内边距”的意思border是“边框”margin是“外边距”真实占有宽度= 左borde原创 2017-07-13 14:20:40 · 628 阅读 · 0 评论 -
02 CSS-继承和层叠
哪些属性可以继承？color、text-开头的、line-开头的、font-开头的这些关于文字样式的，都能够继承；所有关于盒子的、定位的、布局的属性都不能继承。继承性是从自己开始，直到最小的元素。层叠性当选择器，选择上了某个元素的时候，那么要这么统计权重：（id的数量，类的数量，标签的数量）权重问题大总结：选择上了，数权重，(id的数量，类的数量，标原创 2017-07-13 14:19:35 · 195 阅读 · 0 评论 -
06 CSS-margin
1、margin的塌陷现象标准文档流中，竖直方向的margin不叠加，以较大的为准如果不在标准流，比如盒子都浮动了，那么两个盒子之间是没有塌陷现象的：2、盒子居中margin:0 auto;margin的值可以为auto，表示自动。当left、right两个方向，都是auto的时候，盒子居中了：margin:0 auto; → 让这个原创 2017-07-13 14:24:14 · 267 阅读 · 0 评论