
CSS
小马Mark
Java
展开
-
1.CSS初识
CSS的初识CSS:Cascading Style Sheet,层叠样式表。CSS的作用就是给HTML页面标签添加各种样式,定义网页的显示效果。简单一句话:CSS将网页内容和显示样式进行分离,提高了显示功能。HTML的缺点维护困难标记不足网页过"胖"定位困难CSS的优点表现与内容分离增强了网页的表现力使整个网站显示风格趋于统一CSS语法每个CSS样式由两个组成部分:选择器(Selector)和声明(Declaration)。声明又包括属性和属性值。每个声明之后用分号原创 2020-06-21 00:15:35 · 144 阅读 · 0 评论 -
2.CSS选择器
标记选择器(元素选择器):标签选择器可以选中所有的标签元素,比如div,ul,li ,p等等,不管标签藏的多深,都能选中,选中的是所有的,而不是某一个,所以说 “共性” 而不是 ”特性“div{ color:red; font-size: 100px;}类选择器:对任何合法的HTML标签都可以使用class属性class属性用于定义页面上的HTML元素标记组,给指定的一组标记设置相同的样式规则如果是多个类要用空格分隔设置class属性后,使用类选择器是由点号“.”及类原创 2020-06-21 00:16:42 · 353 阅读 · 1 评论 -
3.选择器的优先级
选择器的权重行内样式 1000> id选择器 100 > 类选择器 10 > 标签选择器 1 > 继承样式 0!important的使用!important:设置权重为无限大 !important 不影响继承来的权重,只影响选中的元素。不要随便使用!important,因为使用它会影响页面的布局当选择器相同的时候,按照顺序来看css样式,谁最后就按照谁渲染继承继承是CSS的一个主要特征,它是依赖于祖先-后代的关系的。继承是一种机制,它允许样式不仅可原创 2020-06-21 00:17:56 · 150 阅读 · 0 评论 -
4.CSS属性相关
相关单位绝对单位英寸(in):使用较为广泛的长度单位(1in=2.54cm)厘米(cm):生活中最常用的的长度单位。毫米(mm):在研究领域使用比较广泛。磅(pt):在印刷领域使用较为广泛,也称为点。CSS也常用pt设置字体大小,12磅的字体等于1/6大小(1pt=1/72in)pica(pc):在印刷领域使用较多,1pc=12pt,所以也称为12点活字。相对单位emem表示元素的字体的高度能够根据字体的font-size属性值来确定单位的大小p{f原创 2020-06-21 00:18:29 · 255 阅读 · 0 评论 -
5.盒子模型
CSS盒模型结构MBPC模型边界(margin)、边框(border)、填充(padding)、内容(content)简称MBPC模型。margin又称外边界(外补丁或外空白):盒子边框与页面边界或其他盒子之间的距离padding又称内边界(内补丁或内空白):内容与边框之间的距离[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ukY98RQJ-1592669922206)(boxmodel.png)]margin属性设置margin-(top|right|bo原创 2020-06-21 00:19:05 · 382 阅读 · 0 评论 -
6.块级标签与行内标签
行内元素:与其他行内元素并排;不能设置宽、高。默认的宽度,就是文字的宽度。块级元素:霸占一行,不能与其他任何元素并列;能接受宽、高。如果不设置宽度,那么宽度将默认变为父亲的100%。块级标签和行内标签的互相转换display属性将块级元素和行内元素进行相互转换。display即“显示模式”。值意义display:“none”HTML文档中元素存在,但是在浏览器中不显示。一般用于配合JavaScript代码使用。display原创 2020-06-21 00:20:41 · 170 阅读 · 0 评论 -
7.页面布局
浮动(float)浮动是css里面布局最多的一个属性,也是很重要的一个属性。float:表示浮动的意思。它有三个值。none: 表示不浮动,默认left: 表示左浮动right:表示右浮动浮动元素会生成一个块级框,而不论它本身是何种元素。关于浮动的两个特点:浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止。由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样。清楚浮动(clear)clear:意思就是清除的原创 2020-06-21 00:21:16 · 135 阅读 · 0 评论