专栏首页白胡杨同学CSS大部分属性汇总

CSS大部分属性汇总

背景类属性

background-color    背景颜色
background-image    背景图片
background-repeat   背景重复
background-attachment   
background-position 背景定位

文本格式类属性

属性

描述

color

设置文本颜色

direction

设置文本方向。

letter-spacing

设置字符间距

line-height

设置行高

text-align

对齐元素中的文本

text-decoration

向文本添加修饰

text-indent

缩进元素中文本的首行

text-shadow

设置文本阴影

text-transform

控制文本大小写转换

unicode-bidi

设置或返回文本是否被重写

vertical-align

设置元素的垂直对齐

white-space

设置元素中空白的处理方式

word-spacing

设置字间距

字体类属性

属性

描述

font

在一个声明中设置所有的字体属性

font-family

指定文本的字体系列

font-size

指定文本的字体大小

font-style

指定文本的字体样式

font-variant

以小型大写字体或者正常字体显示文本。

font-weight

指定字体的粗细。

链接的四种状态(也叫伪类选择器)

a:link - 正常,未访问过的链接
a:visited - 用户已访问过的链接
a:hover - 当用户鼠标放在链接上时
a:active - 链接被点击的那一刻

列表属性

属性

描述

list-style

简写属性。用于把所有用于列表的属性设置于一个声明中

list-style-image

将图象设置为列表项标志。

list-style-position

设置列表中列表项标志的位置。

list-style-type

设置列表项标志的类型。

边框属性

border-style属性用来定义边框的样式
border-width 属性为边框指定宽度。
border-color属性为边框指定颜色

轮廓属性

outline-color	设置轮廓的颜色
outline-style	设置轮廓的样式	
outline-width	设置轮廓的宽度

内边距与外边距

margin  外边距
padding 内边距

CSS尺寸属性

属性

描述

height

设置元素的高度。

line-height

设置行高。

max-height

设置元素的最大高度。

max-width

设置元素的最大宽度。

min-height

设置元素的最小高度。

min-width

设置元素的最小宽度。

width

设置元素的宽度。

CSS控制元素显示隐藏的两个属性

visibility属性

描述

visible

默认值。元素是可见的。

hidden

元素是不可见的。

collapse

当在表格元素中使用时,此值可删除一行或一列,它不会影响表格的布局。被行或列占据的空间会留给其他内容。

inherit

规定应该从父元素继承 visibility 属性的值。

display属性

描述

none

此元素不会被显示。

block

此元素将显示为块级元素,此元素前后会带有换行符。

inline

默认。此元素会被显示为内联元素,元素前后没有换行符。

inline-block

行内块元素。(CSS2.1 新增的值)

list-item

此元素会作为列表显示。

run-in

此元素会根据上下文作为块级元素或内联元素显示。

compact

CSS 中有值 compact,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。

marker

CSS 中有值 marker,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。

table

此元素会作为块级表格来显示,表格前后带有换行符。

inline-table

此元素会作为内联表格来显示,表格前后没有换行符。

table-row-group

此元素会作为一个或多个行的分组来显示

table-header-group

此元素会作为一个或多个行的分组来显示

table-footer-group

此元素会作为一个或多个行的分组来显示

table-row

此元素会作为一个表格行显示

table-column-group

此元素会作为一个或多个列的分组来显示

table-column

此元素会作为一个单元格列显示

table-cell

此元素会作为一个表格单元格显示

table-caption

此元素会作为一个表格标题显示

inherit

规定应该从父元素继承 display 属性的值。

CSS定位属性(此处只列举position)

position属性有五种取值

描述

relative

根据元素位置相对定位

absolute

绝对定位的元素的位置相对于最近的已定位父元素,如果元素没有已定位的父元素,那么它的位置相对于<html>:

static

HTML 元素的默认值,即没有定位,遵循正常的文档流对象。

fixed

元素的位置相对于浏览器窗口是固定位置。

sticky

基于用户的滚动位置来定位。

CSS溢出属性

css有一个属性专门控制元素内容溢出的处理:Overflow

描述

visible

默认值。内容不会被修剪,会呈现在元素框之外。

hidden

内容会被修剪,并且其余内容是不可见的。

scroll

内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。

auto

如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。

inherit

规定应该从父元素继承 overflow 属性的值。

CSS浮动

属性

描述

clear

指定不允许元素周围有浮动元素。

left、right、both、none、inherit

float

指定一个盒子(元素)是否可以浮动。

left、right、none、inherit


注意事项:

要水平居中对齐一个元素, 可以使用 margin: auto;。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • HTML属性及事件

    白胡杨同学
  • PHP常量

    该方式定义的常量必位于最顶端的作用区域,通常在编译时使用,而且不能在函数内、循环内、if语句内使用

    白胡杨同学
  • CSS组合选择符

    在 CSS3 中包含了四种组合方式: 后代选择器(以空格分隔) 子元素选择器(以大于号分隔) 相邻兄弟选择器(以加号分隔) 普通兄弟选择器(以波浪号分隔)

    白胡杨同学
  • Pseudo elements伪元素与Pseudo classes伪类

    ::after用于描述处于css渲染层的一个伪元素,相当于选中元素的最后一个子元素,但这个元素与DOM节点无关,位于选择的元素之后,伪元素的内容用content...

    gojam
  • 前端-CSS 最核心的几个概念

    本文将讲述 CSS 中最核心的几个概念,包括:盒模型、position、float等。这些是 CSS 的基础,也是最常用的几个属性,它们之间看似独立却又相辅相成...

    grain先森
  • JavaWeb(八)JQuery

    jQuery 市场用得比较多两个框架: jQuery 比较适合做一些互联网 的应用(12306.com,蘑菇街,美丽说,聚美) extjs 比较适合做后台管理系...

    二十三年蝉
  • css选择器

    下面是一张取自w3cschool的css选择器表 链接地址:http://www.w3school.com.cn/cssref/css_selectors.as...

    lonelydawn
  • jquery教程之查找筛选函数

    三、children 取得一个包含匹配的元素集合中每一个元素的所有子元素的元素集合。

    老雷PHP全栈开发
  • 如何使用python进行web抓取?

    本文摘要自Web Scraping with Python – 2015 书籍下载地址:https://bitbucket.org/xurongzhong/py...

    CDA数据分析师
  • 我不知道你知不知道我知道的伪元素小技巧

    伪元素能做什么?我们要他有何用?它能为我们解决什么问题?和其他的方法相比她有什么有点?我们为什么要使用它?

    sunseekers

扫码关注云+社区

领取腾讯云代金券