css样式

拈花ヽ惹草 提交于 2019-12-03 01:36:17

大小:

width:宽度

height:高度

背景:

background-color  背景色

 

background-image  背景图片

background-repeat  背景平铺方式

background-size  背景尺寸

 

background-position  背景位置

字体:

font-family 字体样式

font-size  字体大小  12px 14px

font-style:italic;  italic倾斜

font-weight:粗细

text-decoration:

underline;下划线

 

overline 上划线

line-through 删除线

none 去掉线   可以用来去掉<a></a>超链接的下划线

 

color:字体颜色

对齐方式:

text-align :水平对齐方式

 

line-height:行高

text-indent:缩进 单位像素

 

line-height 与 vertical-align:

line-height:主要作为调节文本的垂直对齐方式,通过设置行高的大小.

vertical-align:主要作为调节行内元素(span/img/input..)的垂直对齐方式  baseline top bottom middle  text-top  text-bottom.

边界边框:

外边距margin上右下左

两个属性时,代表 上下   左右

行内元素只能调整margin-left margin-right。调margin-top和margin-bottom是不管用的

内边距padding上右下左

如果加了内边距,该元素会相应的变大

border 1px solid red;  分别代表粗细 线的样式 颜色;

 

显示与隐藏display:none/block;

列表方块<ol></ol> <ul></ul>

list-style:none  将列表前面的序号去掉

list-style-image  可以将前面的序号变成图片

格式与布局

位置position

fixed 固定相对于浏览器的边框进行定位

absolute 绝对定位相对于父级元素(浏览器、绝对定位的上级)

relative 相对定位相对于自身应该出现的位置

top 距离上边的距离

right 距离右边的距离

left 距离左边的距离

bottom 距离下边的距离

float

left 向左流

right 向右流

clear

both 清除所有的流

left 清除左边的流

right 清除右边的流

z-index分层需要前面使用position之后才有效果,值越大越靠上

 

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!