概述
1.css和html的结合方式(四种结合方式)
(1)在每个html标记上都有一个属性style,把css和html结合在一起
-
(2)使用html的一个标签实现
例
2.css的优先级(一般情况)
由上到下,由内到外。优先级由低到高。
后加载的优先级高。
3.选择器:格式
选择器名称{
属性名:属性值;
属性名:属性值;
}
css的基本选择器(三种)
(1)标签选择器
使用标签名作为选择器的名称
div{
background-color:blue;
cloor:red;
}
(2)class选择器
每个html标签都有一个属性class
div.class|.class{
background-color:orange;
}
(3)id选择器
每个html标签都有一个属性id
div#hehe|#hehe{
background-color:orange;
}
基本选择器的优先级:
style > id选择器 > class选择器 > 标签选择器
4.css的扩展选择器
(1)关联选择器
wwwwwwwwwwwwwwwwwwwww
设置div标签里面p标签的样式,嵌套标签里面的样式
div p {
background-color:green;
}
(2)组合选择器
222222222
把div和p标签设置成相同的样式,把不同的标签设置成相同的样式
div,p {
background-color:orange;
}
(3)伪元素选择器
css里面提供了一些定义好的样式,可以拿过来使用
比如超链接:
超链接的状态
原始状态 鼠标放上去 点击 点击之后
:link :hover :active :visited
5.css的盒子模型
在进行布局前要把数据封装到一块一块的区域内(div)
(1)边框
border:统一设置
border:2px solid bule;
border-top 上
border-bottom 下
border-left 左
border-right 右
(2)内边距
padding:统一设置
padding:20px;
padding-top 上
padding-bottom 下
padding-left 左
padding-right 右
(3)外边距
margin:统一设置
margin:20px;
margin-top 上
margin-bottom 下
margin-left 左
margin-right 右
6.css布局的漂浮
float:
属性值
left: 文本流向对象的右边
right: 文本流向对象的左边
7.css布局的定位
position:
属性值
absolute:
将对象从文档流中拖出
可以使用top、bottom等属性进行定位
relative:
不会把对象从文档流中拖出
可以使用top、bottom等属性进行定位
最后
以上就是调皮西牛为你收集整理的css内容的全部内容,希望文章能够帮你解决css内容所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复