十年专注于网站建设与互联网应用开发,低调、有情怀的网络应用服务商!
南昌百恒科技微信公众号 扫一扫关注
tel-icon全国服务热线:400-680-9298,0791-88117053
扫一扫关注百恒科技微信公众号

Web前端之CSS常用知识点

百恒 2019-12-13 15:00:54 16
CSS是层叠样式表.作用来定义网页的显示效果。简单一句话:CSS将网页内容和显示样式进行分离,提高了显示功能。CSS可以更加精细的控制网页的内容形式。

一.CSS的三种样式:

行内样式表、内部样式表、外部引入样式表。


优先级:行内样式 > 内部样式 > 外部引入样式



二.大多数块元素都有这两个属性

id属性:用来作为页面中某个元素的唯一标识

class属性:用来指定页面中的元素属于某一类(可以是不同标记的元素)

选择器名称 { 属性名:属性值;属性名:属性值;…….}

三.基本选择器:

标签选择器:p { font-size:2em; }

类选择器:.info { background:#ff0; }

ID选择器: #info { background:#ff0; }

组合选择器:(或) ul,li,a{color:red;}

关联选择器:(与) ul li{background: #000;}

伪类选择器:a:link{} 没有访问之前 a:visited{} 访问后 a:hover{} 鼠标点击之后 a:active{} 点击超链接时的状态

margin:布局外边距

padding:布局内边距

四.关联选择器(类似于and关系)

标签是可以嵌套的,要让相同标签中的不同标签显示不同样式,就可以用此选择,例:

p { color:#00FF00;}

p b { color:#FF000;}

五.css布局模型

清楚了CSS 盒模型的基本概念、 盒模型类型, 我们就可以深入探讨网页布局的基本模型了。布局模型与盒模型一样都是 CSS 最基本、 最核心的概念。 但布局模型是建立在盒模型基础之上,又不同于我们常说的 CSS 布局样式或 CSS 布局模板。如果说布局模型是本,那么 CSS 布局模板就是末了,是外在的表现形式。

CSS包含3种基本的布局模型,用英文概括为:Flow、Layer 和 Float。

400-680-9298,0791-88117053
扫一扫关注百恒网络微信公众号

欢迎您的光顾,我们将竭诚为您服务×

 
 
 
 
 
 
 
 
×