5月 28日css前端知识

a:link {color : #FF0000} #未访问连接时设置颜色

a:visited {color: #FF0000} #访问过得连接设置颜色

a:hover {color: #FF0000} #鼠标放在上面设置的颜色

a:active{color: #FF0000} #选定时设置的颜色

input: focus{outline:none; background-color:#eee}

p.first_letter{ font_size:24px ; }

p.before {content:'@'; } 在每个p标签前面加内容@

p.after {content:'@'; } 在每个p标签后面加内容@

before和after多用于清除浮动。

优先级：内联式》id选择器》类选择器》元素选择器也可以用!important 强制生效

width设置宽度，height设置高度。块级标签才能设置宽度，内联标签的宽度由内容来决定

body {

font-family: "Microsoft Yahei", "微软雅黑", "Arial", sans-serif} font-family可以把多个字体名称作为一个“回退”系统来保存。如果浏览器不支持第一个字体，则会尝试下一个。浏览器会使用它可识别的第一个值。

p {font-weight:bold 或font-weight:bolder

} 字体粗度，粗或更粗

p {color : #FF0000或RGB（255，0，0）或red或者 rgba(255，0，0 ， 1)最后一个透明度0-1

}

p{ text-align:center(居中)，left（左对齐），right（右对齐）}

p{text-decoration: underline (文本下一条线)，overline（文本上的一条线），line-through(穿越文本的一条线)}

常用来去除a标签下的一条线 a {text-decoreation:none}

p{text-indent:32px}首行缩进

p{ background-color:red,background-image:url('1.jpg'),

background-repeat：no-repeat #设置图片不铺满整个背景 background-repeat:repeat-x #设置图片铺满x轴

background-position: right,top(背景在右上角) ， background-position：200px，200px

background:#ffffff url('1.png') no-repeat right top;支持简写

background-attachment: fixed 滚轮背景不动宽度要设置成百分百，width:100%

}

#i1{border-width: 2px;border-style:solid(实线边框，还有none，dashed虚线边框); border-color:red }#设置边框属性

#i2{border:2px solid red} 为单独某一边框赋值，border-top-color border-bottom-style

用这个属性能实现圆角边框的效果。

将border-radius设置为长或高的一半即可得到一个圆形。

display:'block' 默认占满整个页面宽度，如果设置了指定宽度，则会用margin填充剩下的部分。

盒子模型：

margin: 用于控制元素与元素之间的距离；margin的最基本用途就是控制元素周围空间的间隔，从视觉角度上达到相互隔开的目的。
padding: 用于控制内容与边框之间的距离；
Border(边框): 围绕在内边距和内容外的边框。
Content(内容): 盒子的内容，显示文本和图像。

浮动 float:right 向左浮动

clear:both 两边不允许浮动 clear left 左侧不允许浮动

默认：.clearfix:after {

content: "";

display: block;

clear: both：

}

overflow:hidden 内容会被修剪，其余内容不可见

overflow:scroll 内容会被修剪，其余内容用滚轮可以查看

position：relative的一个主要用法：方便绝对定位元素找到参照物。

position:absolute 对象脱离正常文档流，使用top，right，bottom，left等属性进行绝对定位。而其层叠通过z-index属性定义。

fixed：对象脱离正常文档流，使用top，right，bottom，left等属性以窗口为参考点进行定位

巴特西

5月 28日css前端知识

最新文章

热门文章