![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS
山上农夫
这个作者很懒,什么都没留下…
展开
-
初试浮动
浮动与清除浮动1、浮动属性说明float定义元素在哪个方向浮动属性值说明none不浮动,显示在文档中的位置,默认值left左浮动,显示在父容器的左侧right右浮动,显示在父容器的右侧例:float: left;//向左浮动float: right;//向右浮动float: none;//不浮动2)清除浮动:clear属性说明clear清除浮动的效果属性值描述left在左侧不允许浮动元...原创 2018-04-25 07:54:50 · 120 阅读 · 0 评论 -
CSS特性之层叠性
CSS的层叠性1、层叠性的条件(1)元素相同(2)属性相同(3)优先级相同2、层叠性的样式冲突(1)引用方式冲突 CSS的引用方式包括内联样式、内嵌样式、导入样式、链接样式,四个的优先级内联样式>内嵌样式>导入样式>链接样式;CSS的部分body{ background: #000000;}HTML的部分<html><head><...原创 2018-04-20 23:55:36 · 4198 阅读 · 0 评论 -
关于元素层叠方法
一、介绍 1、网页虽然是一个平面但是,实际上网页是一个三维的结构,它利用x轴和y轴设置位置,利用z轴设置元素所在的层面的先后顺序。 2、一般情况下,元素的z-index属性处于不被激活状态,即一般情况下,它是无效的,只有使用了“position: relative;”和“position: absolute;”,还有“position: fixed;”才会被激活,二、语法z-index:...原创 2018-04-25 18:00:17 · 420 阅读 · 0 评论 -
CSS选择器
一、选择器 1、基本选择器 (1)标签选择器body{ background: #14B3A2; } h1{ color: #C648CD; } (2)id选择器:每个id唯一 css部#one{ font-size: 20px; }#two{ font-colour:#fff; } ...原创 2018-04-25 20:36:10 · 145 阅读 · 0 评论 -
CSS之深入选择器
一、选择器在浏览器的解析原理选择器是从右往左进行解析二、选择器的解析速度id选择器>class选择器>元素选择器>相邻选择器>子选择器>后代选择器>通配符选择器>属性选择器>伪类选择器三、优化方法1、不要使用通配符2、不要在id选择器和class选择器前添加元素名3、选择器尽量不要超过三层,右侧选择器尽量精确4、少用后代选择器和子选择器解释:这些优化...原创 2018-04-25 20:46:23 · 288 阅读 · 0 评论 -
CSS特性之继承性
一、CSS的继承性 1、无继承性的属性 (1)文本属性:属性说明vertical-align垂直文本对齐text-decoration规定添加到文本的装饰text-shadow文本阴影效果white-space空白符的处理unicode-bidi设置文本的方向 (2)盒子模型的属性:属性说明width宽度height高度margin的各个系列外边距的各个系列border的...转载 2018-04-20 20:34:52 · 2738 阅读 · 0 评论 -
样式的参数单位
样式的参数单位1、长度单位(1)相对类型长度单位:收参考系的变化而变化相对长度单位说明em元素的字体高度ex字母x的高度px像素%百分比1)%a、width、height、font-size的百分比是相对于父元素“相同属性”的值计算。b、line-height的百分比是相对于父元素的font-size计算c、vertical-align的百分比是相对于当前的line-height值计算2)eme...原创 2018-04-20 20:25:13 · 504 阅读 · 0 评论 -
CSS之外边距的叠加
1、水平外边距永远不会叠加,水平外边距指margin-left,margin-right2、外边距叠加时,叠加的高度等于两个相互叠加的外边距最大的那一个边距3、外边距只是针对块级元素...原创 2018-04-23 20:49:22 · 172 阅读 · 0 评论 -
CSS的元素的隐藏与显示
显示与隐藏1、介绍: display:使段落生出行内框 visibility :属性规定元素是否可见。2、display属性值描述none此元素不会被显示。block此元素将显示为块级元素,此元素前后会带有换行符。inline默认。此元素会被显示为内联元素,元素前后没有换行符。inline-block行内块元素。(CSS2.1 新增的值)list-item此元素会作为列表显示。run-in此元...原创 2018-04-23 20:56:22 · 9899 阅读 · 0 评论 -
CSS之段落缩进、Logo方法------text-indent
text-indent一、段落缩进首行缩进两格<html><head><meta charset="utf-8"><title>无标题文档</title> <style type="text/css"> p{ text-indent: 2em; } </style&原创 2018-04-24 19:17:20 · 952 阅读 · 0 评论 -
CSS中令人忽略的常识
一、顶线、中线、基线、底线二、行高、行距与半行距(1)行高两行基线之间的垂直距离(2)行距指上一行的底线到下一行的垂直距离(3)半行距行距的一半三、内容区与行框(1)内容框行盒子顶线到底线之间的垂直距离(2)行框两行文字“行半具分割线”之间的垂直距离...原创 2018-04-24 19:35:50 · 159 阅读 · 0 评论 -
CSS之深入了解vertical-align
一、使用范围1、inline元素、inline-block元素和table-cell元素有效,对块级元素无效二、属性取值负数、百分比和关键字三、作用原理1、用于定义“周围的文字、inline元素以及inline-block元素”,相对于被定义的vertical-align的元素的基线的垂直对齐方式。2、table-cell元素的vertical-align属性是针对自身而言。vertical-al...原创 2018-04-24 19:50:22 · 136 阅读 · 0 评论 -
表单基础
(1)工作原理 其是web页面的一部分,用于收集用户信息,并将其发送给服务器(2)标签的创建 <body> <form name="form1" action="somepage.php" method="get"> <p></p> </form> </body&原创 2018-04-24 19:51:38 · 144 阅读 · 0 评论 -
深入表单
一、单选框和复选框与文字的垂直居中 1、语法 元素 { vertical-align:像素值; } 2、例 (1)当文字大小为12px时,定义单选框和复选框为“vertical-align:-3px”; (2)当文字大小为14px时,定义单选框和复选框为“vertical-align:-2px”; 3、解释:vertical-align:-3px是相对于基线而言向下移动3px。二...原创 2018-04-24 20:27:30 · 92 阅读 · 0 评论 -
初试边框
1、边框(1)边框的属性属性说明border整体边框border-top上边框border-bottom下边框border-right右边框border-left左边框(2)边框的样式:border-style值描述none定义无边框。hidden与 "none" 相同。不过应用于表时除外,对于表,hidden 用于解决边框冲突。dotted定义点状边框。在大多数浏览器中呈现为实线。dashed定...原创 2018-04-20 18:02:00 · 135 阅读 · 0 评论 -
深入边框----border之border:0与border:none区别
两者的主要差异;分为性能差异与兼容差异一、性能差异 1、border:0px 表示把边框的宽度定义为0px;虽然边框的宽度为0px;看不见,但是浏览器依然会对border进行渲染,所以border, 实际上是占用内存的。 2、border:none 表示把边框的宽度定义为“none(无)”,所以此时浏览器不会进行渲染,也就不会占用内存了。二、兼容差异这两...原创 2018-04-20 18:13:46 · 830 阅读 · 0 评论