CSS学习笔记整理
浏览数：24 /
时间：2015年06月09日
- div+css布局：div是用于存放内容（文字，图片，元素）的容器
使html文件内容减少，html变得简单；内容和样式分离
css可以统一网站风格
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
DOCTYPE：文档类型，用于指定DTD（说明当前这个html文件的版本）
- < 元素名 background-color: rgb(255, 255, 255); color: rgb(0, 0, 0); font-family: 微软雅黑; font-size: 14px; font-style: normal; font-weight: normal; line-height: 1.5;">属性名：属性值；"/>
- <style type="text/css">
</style>
- 字体：font-size字体大小；font-weight字体粗细；font-style字体风格倾斜；color字体颜色
- text-decoration:underline;none;
- <style type="text/css">
filter：gray；
}
</style>
鼠标悬停变回原来颜色
- <style type="text/css">
filter：gray；
}
a:hover img{
filter：""；
}
a:visited img{
color：red；
}
</style>
- 选择器：类选择器、id选择器、html选择器、通配符选择器
- 类选择器：<link rel="stylesheet" type="text/css" href="#">;用class="类选择器名"使用
.类选择器名{ .style1{
属性名：属性值； font-weight:bold;
... font-size:2px;
} }
... font-size:2px;
} }
- id选择器：用id="id选择器名"
#id选择器名{ #style2{
属性名：属性值； font-weight:bold;
... font-size:2px;
} }
... font-size:2px;
} }
- html选择器：html文件元素的名称
html元素名称{ body{
属性名：属性值；
... font-size:2px;
} }
... font-size:2px;
} }
- 当一个元素同时被id选择器、类选择器和html选择器修饰，优先级是
- 一个元素最多只有一个id选择器，但是可以有多个类选择器。
- 在引用多个class选择器的时候，class="style1 style2"，以最后出现的类选择器样式为主
- 通配符选择器：所有元素都符合一种样式
margin:0;padding:0;
}
margin: 10 10 10 10；
如果margin给出四个值,则表示 上，右，下，左
- 父子选择器:子选择器标签是html可以识别的标签；
#style2 span span{color="red";font-size="20";}
- 在有些css中，我们可以多个选择器的共同部分提取出来，写在一起，简化css文件
- 块元素和行内元素
- 行内元素又叫内联元素，只能容纳文本或其他内联元素（不同浏览器不同），常见有<span>h和<a>
- 块元素一般从新行开始，可容纳文本，其他内联元素和其他块元素，即使内容不够一行，也会占满整行。常见有<div>和<p>
- 块元素和行内元素相互转换:display:inline;转为行内元素
- 流：标准流：布局中，元素按顺序排列出现
非标准流：布局中，某个元素脱离了标准流
- 盒子模型
- 浮动分为左浮动、右浮动和清除浮动。对块元素和行内元素都生效。向左/右浮动就相当于让出自己的左/右边，别的元素就会在它的左/右边排列。float:left;right;文字环绕图片效果。
默认情况下：
调整后：
- 定位：用position对元素进行定位。属性值有static(默认值)、relative(相对定位)、absolute(绝对定位)、fixed(元素框的表现类似于position设为absolute，不过其包含的块是视窗本身).
- 格式：position:属性值
absolute：元素从原来位置脱离,让出原来位置,被后面的元素战占有。参照点是离它最近的那个非标准流而言。
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
