DIV常用属性大全自己整理

2019-10-26 17:13:58

字体：大中小

来源：转载

供稿：网友

一、属性列表

复制代码

代码如下:
color : #999999 文字颜色
font-family : 宋体文字字型
font-size : 10pt 文字大小
font-style:itelic 文字斜体育
font-variant:small-caps 小字体
letter-spacing : 1pt 文字间距
line-height : 200% 设定行高
font-weight:bold 文字粗体
vertical-align:sub 下标字
vertical-align:super 上标字
text-decoration:line-through 加?h除线
text-decoration:overline 加顶线
text-decoration:underline 加底线
text-decoration:none ?h除连接底线
text-transform : capitalize 首字大写
text-transform : uppercase 英文大写
text-transform : lowercase 英文写
text-align:right 文字*右对齐
text-align:left 文字*左对齐
text-align:center 文字置中对齐
这些是一些简单的文字效果，可以应用到css的页面中。　
背景
background-color:black 背景颜色
background-image : url(image/bg.gif) 背景图片
background-attachment : fixed 固定背景
background-repeat : repeat 重复排列-网页预设
background-repeat : no-repeat 不重复排列
background-repeat : repeat-x 在x轴重复排列
background-repeat : repeat-y 在y轴重复排列
background-position : 90% 90% 背景图片x与y轴的位置　
链接
A 所有超连接
A:link 超连接文字格式
A:visited 浏览过的连接文字格式
A:active 按下连接的格式
A:hover 鼠标移至连接
边框
border-top : 1px solid black 上框
border-bottom : 1px solid #6699cc 下框
border-left : 1px solid #6699cc 左框
border-right : 1px solid #6699cc 右框
border: 1px solid #6699cc 四边框
虚线
<TEXTAREA STYLE="border:1px dashed pink">
实线
<TEXTAREA STYLE="border:1px solid pink">
设置div的高度与文字的行高一样就可以了,即 line-height 和 height 的数值是一样的就可以了,最后给div一个 over-flow: hidden ,让超出的部分隐藏.

二、常用属性

复制代码

代码如下:
1、Height:设置DIV的高度；Width:设置DIV的宽度。
2、margin:用于设置DIV的外延边距，也就是到父容器的距离。margin:后面跟有四个距离分别为到父容器的上-右-下-左边的距离；margin: [top][right][bottom][left]
可以分别设置：margin-left:到父容器左边框的距离；margin-right:到父容器右边框的距离；margin-top: 到父容器上边框的距离；margin-bottom:到父容器下边框的距离。
3、padding:用于设置DIV的内边距（内如子元素与DIV边界的距离）。padding:后面跟有四个距离分别为到父容器的上-右-下-左边的距离；margin: [top][right][bottom][left]：需要注意的是padding设置的距离不包括在本身的width和height内(在IE7和FF中)，比如一个DIV的width设置了100px,而padding-left设置了50px,那么这个DIV在页面上显示的将是150px宽。
4、border:设置DIV的边框样式；display:设置显示属性。其值有block、none；float:设置DIV在页面上的流向，其值有left(靠左显示)、right(靠右显示)、none；
background:设置DIV的背景样式；background后可直接跟背景的颜色、背景图片、平铺方式等样式。也可以用以下属性分别设置。
background-color:设置背景颜色；background-attachment:背景图像的附加方式，其值有scroll、fixed; background-image:指定使有的背景图片;background-repeat:背景图象的平铺方式。其值有no-repeat(不平铺)、repeat(两个方向平铺)、repeat-x(水平方向平铺)、repeat-y(垂直方向平铺); background-position:在DIV中定位背景位置。其值有top bottom left right的不同组合。也可以以用坐标指定具体的位置。
5、position:设置DIV的定位方式。position的属性中有static、fixed、relative、absolute四个属性。常用relative和absolute。若指定为static时，DIV遵循HTML规则；若指定为relative时，可以用top、left、right、bottom来设置DIV在页面中的偏移（相对于自身的偏移），但是此时不可使用层；若指定为absolute时，可以用top、left、right、bottom对DIV进行绝对定位（对自己最近的父级元素）；若指定为fixed时，在IE7与FF中DIV的位置相对于屏屏固定不变，IE6中没有效果（不知为什么）。
6、font:指定DIV中文本的样式，其后可跟文本的多个样式。font-family:设置要用的字体名称；font-weight:指定文本的粗细,其值有bold bolder lighter等；font-size:指定文本的大小；font-style:指定文本样式，其值有italic normal oblique等；color:指定文本颜色；text-align:指定文本水平对齐方式，其值有center(居中) left right justify；text-decorator:用于文本的修饰；其值有none underline overline line-through和blink的组合；text-indent:设置文本的缩进；text-transform:设置文本的字母大小写。其值有lowercase uppercase capitalize(首字母大写) none；direction:内容的流向。其值有ltr(从左至右)、rtl(从右至左)；line-height:指定文本的行高；Word-spacing:字间距。
7、overflow:内容溢出控制，其值有scroll(始终显示滚动条)、visible(不显示滚动条，但超出部分可见)、auto(内容超出时显示滚动条)、hidden(超出时隐藏内容)。

上一篇：表单元素属性readonly和disabled使用对比

下一篇：在html中添加script脚本的2种方法和注意事项

发表评论

共有条评论