1、background缩写方式

background : background-color | background-image | background-repeat | background-attachment | background-position

缩写代码:

background: #aaaaaa url(../image/logo..jpg) no-repeat fixed -50px 50px;

等价形式代码:

background-color: #aaaaaa;

background-image: url(../image/logo.jpg);

background-repeat: no-repeat;

background-attachment: fixed;

background-position: -50px 50px;

2、font缩写方式

font : font-style | font-variant | font-weight | font-size/line-height |font-family

缩写代码:

font: italic small-caps bold 20px/40px Arial;

等价形式代码:

font-style: italic;

font-variant: small-caps;

font-weight: bold;

font-size: 20px;

line-height: 40px;

font-family: Arial;

注:使用这一简写方式你至少要指定font-size和font-family属性,其他的属性如:font-weight、font-style、font-variant、line-height,如果未指定将自动使用默认值,并且在缩写时font-size与line-height中间要加入“/”斜扛。

3、border缩写方式

border : border-width | border-color | border-style

注:border缩写没有先后顺序,哪个值写在前或写在后都一样。

缩写代码:

border: 1px #ffaadd solid;

等价形式代码:

border-width: 1px;

border-color: #ffaadd;

border-style: solid;

4、margin缩写形式方式

margin : top | right | bottom | left

定义上、右、下、左值的缩写代码:

margin: 10px 20px 30px 40px;

等价形式代码:

margin-top: 10px;

margin-right: 20px;

margin-bottom: 30px;

margin-left: 40px;

定义上与下、左与右为相同值的缩写代码:(第一个值定义上下,第二个值定义左右)

margin: 10px 20px;

等价形式代码:

margin-top: 10px;

margin-right: 20px;

margin-bottom: 10px;

margin-left: 20px;

定义上、右、下、左四个相同值的缩写代码:

margin: 10px;

等价形式代码:

margin-top: 10px;

margin-right: 10px;

margin-bottom: 10px;

margin-left: 10px;

5、padding的简写方式和margin一样,请参考上面margin的缩写方式。

css 的缩写形式,CSS样式中的几种缩写方式相关推荐

  1. JavaScript中的几种继承方式及优缺点,你知道多少呢?

    原文连接:JavaScript中的几种继承方式及优缺点,你知道多少呢? 继承也是前端里面的重要的一个知识点,在实际工作中或者面试中也会经常的遇到,那么通过这篇文章我们详细的了解一下继承的几种方式以及各 ...

  2. java用户输入解析_Java中的3种输入方式实现解析

    Java中的3种输入方式实现解析 发布于 2020-8-8| 复制链接 摘记: 这篇文章主要介绍了Java中的3种输入方式实现解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学 ...

  3. link linux 跨设备,Linux中的两种link方式

    Linux系统中包括两种链接方式:硬链接(hard link)和符号链接(symbolic link),其中符合链接就是所谓的软链接(soft link),那么两者之间到底有什么区别呢? inode ...

  4. python请输入_python中的三种输入方式

    python中的三种输入方式 python2.X python2.x中以下三个函数都支持: raw_input() input() sys.stdin.readline() raw_input( )将 ...

  5. @AspectJ中的几种通知方式详解

    本文来详细说下@AspectJ中的几种通知方式 文章目录 概述 通知方式说明 一个例子 本文小结 概述 当Spring 2.0发布以后,Spring AOP增加了新的使用方式,Spring AOP集成 ...

  6. java一行输入多个数据类型_Java中的3种输入方式实现解析

    这篇文章主要介绍了Java中的3种输入方式实现解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 1.从键盘读取char类型数据 char ch = ...

  7. IPC机制(三)--->Android中的几种IPC方式

    目录 1.每日一句 2. 作者简介 3. Android中的几种IPC方式 3.1 使用Bundle 3.2 使用文件共享 3.3 使用Messenger 3.4  使用AIDL 3.4.1 服务端 ...

  8. PHP中的6种加密方式

    PHP中的6种加密方式 1. MD5加密 string md5 ( string $str [, bool $raw_output = false ] ) 参数 str  --  原始字符串. raw ...

  9. Map集合中的两种取出方式keySet和entrySet

    /*map集合中的两种取出方式:1.Set<k> keySet:将map集合中所有的键存入到Set集合,因为Set具备迭代器.所有可用迭代方式取出所有的键,再根据get方法,获取每一个键对 ...

最新文章

  1. 【集训队作业2018】围绕着我们的圆环
  2. LaTeX输入单个点、横向多个点、竖向多个点、斜向多个点
  3. php 表单搜索,wordpress的搜索表单searchform.php
  4. 入门Web前端要注意什么?要学哪些软件?
  5. python 概率分布_python实现概率分布
  6. 列出所有K个元素的子集-----2013年1月26日
  7. 2017年读书计划(一)
  8. kafka tool 查看指定group下topic的堆积数量_ELK架构下利用Kafka Group实现Logstash的高可用...
  9. 如何查看Oracle数据库字符集 尚未研究
  10. 深入理解iPhone静态库
  11. 详解ProToolkit注册文件
  12. db9针232接口波特率标准_RS232串口通信:接口定义、标准接法详细说明,一看就懂了...
  13. linux命令scp和sftp
  14. Python 组织机构代码证校验
  15. ubuntu18.04鼠标正常使用,而键盘失灵
  16. 埋点 神策小程序_神策埋点思路
  17. 七万字,151张图,通宵整理消息队列核心知识点总结!这次彻底掌握MQ!
  18. 手机信息采集 ——基于ebay网站Apple手机案例分析
  19. 自然语言处理之——关键词提取(一)
  20. 高中数学有哪些好的学习方法?

热门文章

  1. 模拟FPV-肥鲨HDO2+无牙仔2+熊猫VT5804ML1+Foxeer野火 时延测试
  2. 无线技巧:学会设置无线上网猫以及网卡
  3. EHW AC/DC耦合
  4. 值得反思:强人都是如何“炼”成的?
  5. Python爬虫入门一:百度首页
  6. MySQL表分区细节逻辑
  7. 在linux中查找运行程序句柄,Linux下查看句柄
  8. 2017.2.12 开涛shiro教程-第七章-与Web集成
  9. 中国电信SMGP接口
  10. Python删除文本中不符合要求的行