码迷,mamicode.com
首页 > Web开发 > 详细

css属性

时间:2018-11-15 00:19:32      阅读:177      评论:0      收藏:0      [点我收藏+]

标签:滚动   none   flow   字母   高版本   样式   英文字母   20px   letter   

css属性
(1)文本属性
文本大小:font-size:value(值);
说明:属性值为数值型时,必须给属性值加单位,属性值为0时除外;
单位可以是px,pt,em
(2)文本颜色:color:#颜色值;
(3)文本字体:font-family;
(4)加粗:font-weight;
(5)倾斜:font-style;
(6)水平对齐方式:text-align;
(7)行高:line-height;
(8)文本修饰:text-decoration;
文本修饰:text-decoration:none(没有修饰)
underline(添加下划线)
overline(添加上划线)
line-through(添加删除线)
blink.(高版本浏览器不支持blink属性)

(9)文字属性简写:font:12px/1.5 "宋体";
说明:
font的属性值应按以下次序书写(各个属性值之间用空格隔开)
顺序: font-style font-weight font-size / line-height font-family
(1)简写时 , font-size和line-height只能通过斜杠/组成一个值,不能分开写。
(2) 顺序不能改变 ,这种简写法只有在同时指定font-size和font-family属性时才起作用,而且,你没有设定font-weight , font-style 他们会使用缺省值。
(10)border:3px solid red;
???? 粗细(数值+单位) ??线型(solid/dashed/dotted/double)?? 颜色;
右边框border-right:
左边框 border-left:
上边框?border-top:
下边框 border-bottom:
solid:实线,dashed:虚线,dotted:点状线,double:双线,
(11)首行缩进:text-indent:value;
说明:①text-indent可以取负值;
②text-indent属性只对第一行起作用。
缩进两个字符可以写:text-indent:2em;
(12)字间距:letter-spacing:value; 控制英文字母或汉字的字距。
(13)词间距:word-spacing:value; 控制英文单词词距。
(14)文本流控制 layout-flow:horizontal(自左向右)
vertical-ideographic(自上而下);
(注:此属性只有IE浏览器支持)
列表的css声明
1、定义列表符号样式:
list-style-type:disc(实心圆)/circle(空心圆)/square(实心方块)/none(去掉列表符号);
2、使用图片作为列表符号:
list-style-image:url( 所使用图片的路径及全称 );
3、定义列表符号的位置:
list-style-position:outside(外边)/inside(里边);
?list-style:none;去掉列表符号

关于背景的css声明
1、背景颜色 background-color:颜色值;
2、背景图片 background-image:url( 背景图片的路径及全称 );
3、 网页上有两种图片形式:插入图片、背景图;
插入图片:属于网页内容,也就是结构。<img/>
背景图:属于网页的表现,背景图上可以显示文字、插入图片、表格等。
4、背景图片平铺
background-repeat:no-repeat(不平铺)/repeat(平铺)/repeat-x(水平平铺)/repeat-y(垂直平铺) }
5、背景图片的位置
background-position:值1 ???值2;
说明:
①属性值有两个值组成,值1是水平位置的坐标值,值2是垂直位置的坐标值;
②值1 = left/center/right/数值; 值2 = top/center/bottom/数值;当两个值都是center的时候可缩小为一个; ③当属性值是数值时,向右方向,向下方向正值
6、背景属性的缩写语法:background:属性值1 ??属性值2?? 属性值3;
如:background:url(背景图片的路径及全称) no-repeat center top;
7、背景图的固定 background-attachment:scroll(滚动)/fixed(固定);

盒模型
css定义的所有元素都可以拥有像盒子一样的外形和平面空间,它是css布局的基石,它规定了网页元素如何显示以及元素间相互关系。
盒模型的组成
内容、填充、边框、边界
1.padding的定义
①padding是元素内容到元素边框之间的距离,叫内填充、补白或内边距;
②padding区域内会显示背景色和背景图片;
2.用法:
1)用来调整内容在容器中的位置关系
2)用来调整子元素在父元素中的位置关系。(注:padding属性需要添加在父元素上。)
3)padding值是额外加在元素原有大小之上的,如想保证元素大小不变,需从元素宽或高上减掉后添加的padding属性值。
3.padding属性值的4种形式:
一个值:padding:2px; 四周的填充都是2px
二个值:padding:10px ??20px ; 上下 ???左右 ?
三个值: padding:10px ??20px ??30px?; 上 ???左右??? 下
四个值:padding:10px ??20px ??30px?? 40px; 上 ??右?? 下 ??左
4.边界:margin,在元素外边的空白区域,被称为外边距。
margin-left:左边界margin-right:右边界margin-top:上边界margin-bottom:下边界

css属性

标签:滚动   none   flow   字母   高版本   样式   英文字母   20px   letter   

原文地址:http://blog.51cto.com/13570197/2317048

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!