• CSS属性汇总


    ■ 总结

    因为页面上显示的所有元素都是在<body>标签里的,因此可以通过给<body>标签指定CSS样式,即可给整个页面指定CSS样式

    但是该方法并不适用所有标签元素,比如标题标签<h1~6>,需要额外指定CSS样式(如字体大小等)

    ■ 字体

    □ 定义

    Font系列属性用于定义字体系列,大小,粗细,和文字样式

    □ 属性

    font-size

    设置字体大小,通常用的单位是px,数字后面一定要写px,具体请参照font-size属性

    font-family

    设置字体,实际工作中按照团队约定来写字体,具体请参照font-family属性

    font-weight

    设置字体粗细,加粗是700或者bold,不加粗是normal或400, 数字不要跟单位,具体请参照font-weight属性

    font-style

    设置字体样式,倾斜是italic,不倾斜是normal,工作中normal最常用,具体请参照font-style属性

    font

    设置文字复合属性,文字复合属性是有规定顺序的,其中字号和字体是必须项,具体请参照font属性

    ■ 文本

    □ 定义

    CSS文本属性可定义文本的外观,比如文本的颜色,对齐文本,装饰文本,文本缩进,行间距等

    □ 属性

    color

    设置文本颜色,通常使用十六进制,具体请参照color属性

    text-align

    设置文本对齐,可以设定文本水平的对齐方式,具体请参照text-align属性

    text-indent

    设置文本缩进,通常用于段落首行缩进2个字的距离,具体请参照text-indent属性

    text-decoration

    设置文本修饰,常用方式为添加下划线和取消下划线,具体请参照text-decoration属性

    line-height

    设置行高,控制行与行之间的距离,具体请参照line-height属性

    ■ 背景

    □ 定义

    CSS背景属性可以给页面元素添加背景样式

    背景属性可以设置背景颜色,背景图片,背景平铺,背景图片位置,背景图像固定等

    □ 属性

    background-color

    作用:背景颜色,值:预定义的颜色值 / 十六进制 / RGB代码,具体请参照background-color属性

    background-image

    作用:背景图片,值:url(图片路径),具体请参照background-image属性

    background-repeat

    作用:是否平铺,值:repeat / no-repeat/ repeat-x / repeat-y,具体请参照background-repeat属性

    background-position

    作用:背景位置,值:length(精确单位)/position(方位名词) 分别是x和y坐标,具体请参照background-position属性

    background-attachment

    作用:背景附着,值:scroll(背景滚动) / fixed(背景固定),具体请参照background-attachment属性

    背景简写

    作用:书写更简单,值:背景颜色,背景图片地址,背景平铺,背景图像滚动,背景图片位置,具体请参照background属性

    背景色半透明

    作用:背景颜色半透明,值:background:rgba(0,0,0,0.3), 后面必须是4个值,具体请参照background属性


    背景图片:实际开发常见于logo或者一些装饰性的小图片或者是超大的背景图片,优点是相比较于插入图片非常便于控制位置,具体请参照text-indent属性

  • 相关阅读:
    基于 html5的 jquery 轮播插件 flickerplate
    grafana配置
    grafana-zabbix部署和使用
    nxlog windows安装部署
    InfluxDB、grafana、collect部署监控(centos6.8)
    InfluxDB基本概念和操作
    InfluxDB1.2.4部署(centos6.8)
    grafana worldPing插件
    prometheus + grafana部署RabbitMQ监控
    prometheus + grafana安装部署(centos6.8)
  • 原文地址:https://www.cnblogs.com/shiliye/p/14144918.html
Copyright © 2020-2023  润新知