css笔记
来源:互联网 发布:mac上的日记软件 编辑:程序博客网 时间:2024/05/29 12:17
CSS起作用遵循权值原则+就近原则
标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100。例如下面的代码:
p{color:red;} /*权值为1*/p span{color:green;} /*权值为1+1=2*/.warning{color:white;} /*权值为10*/p span.warning{color:purple;} /*权值为1+1+10=12*/#footer .note p{color:yellow;} /*权值为100+10+1=111*/
注意:还有一个权值比较特殊–继承也有权值但很低,有的文献提出它只有0.1,所以可以理解为继承的权值最低。
相同权值,离标签近的起作用
可以用!important(写在;前面)改变权值为最高
>选择第一代子元素
空格选择后代所有元素
标签的文字效果可以继承
letter-spacing为字母之间的距离
word-spacing为单词之间的距离
border-width的值可以为thin|medium|thick,但是常用的为px
三种布局模型
1. 流动模型
2. 浮动模型
3. 层模型
层模型的三种形式
1. 绝对定位(position:absolute)
2. 相对定位(postion:relative)
3. 固定定位(postion:fixed)
font-variant
值 描述
normal 默认值。浏览器会显示一个标准的字体。
small-caps 浏览器会显示小型大写字母的字体。
inherit 规定应该从父元素继承 font-variant 属性的值。
margin,padding,backgroud,font都可以缩写,节省带宽
font缩写时必须指定font-size 和 font-family 属性,其他的属性(如 font-weight、font-style、font-varient、line-height)如未指定将自动使用默认值。font-size 与 line-height 中间要加入“/”斜扛。
内联元素水平居中:text-align:center
定宽块状元素水平居中:margin:0 auto
不定宽块状元素水平居中有三种方法
1. 加入table标签
2. 设置display:inline
3. 设置父级元素position:relative;left:50%,后代元素position:relative;left:-50%
父元素高度确定的单行文本的竖直居中的方法是通过设置父元素的 height 和 line-height 高度一致来实现的。
父元素高度确定的多行文本、图片、块状元素的竖直居中的方法有两种:
方法一:使用插入 table (包括tbody、tr、td)标签,同时设置 vertical-align:middle。
方法二:在 chrome、firefox 及 IE8 以上的浏览器下可以设置块级元素的 display 为 table-cell,激活 vertical-align 属性,但注意 IE6、7 并不支持这个样式。
有一个有趣的现象就是当为元素(不论之前是什么类型元素,display:none 除外)设置以下 2 个句之一:
position : absolute
float : left 或 float:right
元素会自动变为以 display:inline-block 的方式显示,当然就可以设置元素的 width 和 height 了且默认宽度不占满父元素。
- css 笔记 --- css 属性
- CSS笔记
- css笔记
- CSS笔记
- CSS笔记
- CSS笔记
- css笔记
- CSS笔记
- CSS笔记
- css笔记
- css笔记
- css笔记
- CSS笔记
- CSS笔记
- css笔记
- css笔记
- CSS笔记
- CSS笔记
- HBase写数据过程
- vbs下载者和powershell下载器
- Android 自定义PopupWindow技巧
- 杭电 1234 和 杭电 2115
- 看看如何解决“SQL Server只能使用Windows身份登录,不能使用sa等Sql server身份进行登录”的问题
- css笔记
- 用数据源(ODBC)创建数据库连接DSN设置
- /bin、/sbin、/usr/bin、/usr/sbin 目录的区别
- HTML
- Android 动画 收集网站链接
- Android Core框架使用手册
- bootstrap的使用
- Java中System.loadLibrary() 的执行过程
- spring 事务传播问题