转载:常用CSS缩写语法总结
使用缩写可以帮助减少你CSS文件的大小,更加容易阅读。css缩写的主要规则如下:
颜色
16进制的色彩值,如果每两位的值相同,可以缩写一半,例如:
#000000可以缩写为#000;#336699可以缩写为#369;
盒尺寸
通常有下面四种书写方法:
property:value1; 表示所有边都是一个值value1; property:value1 value2; 表示top和bottom的值是value1,right和left的值是value2 property:value1 value2 value3; 表示top的值是value1,right和left的值是value2,bottom的值是value3 property:value1 value2 value3 value4; 四个值依次表示top,right,bottom,left 方便的记忆方法是顺时针,上右下左。具体应用在margin和padding的例子如下: margin:1em 0 2em 0.5em;
边框(border)
边框的属性如下:
border-width:1px; border-style:solid; border-color:#000; 可以缩写为一句:border:1px solid #000;语法是border:width style color;
背景(Backgrounds)
背景的属性如下:
background-color:#f00; background-image:url(background.gif); background-repeat:no-repeat; background-attachment:fixed; background-position:0 0; 可以缩写为一句:background:#f00 url(background.gif) no-repeat fixed 0 0;语法是background:color image repeat attachment position;你可以省略其中一个或多个属性值,如果省略,该属性值将用浏览器默认值,默认值为:color: transparent image: none repeat: repeat attachment: scroll position: 0% 0%
字体(fonts)
字体的属性如下:
font-style:italic; font-variant:small-caps; font-weight:bold; font-size:1em; line-height:140%; font-family:"Lucida Grande",sans-serif; 可以缩写为一句:font:italic small-caps bold 1em/140% "Lucida Grande",sans-serif;注意,如果你缩写字体定义,至少要定义font-size和font-family两个值。
列表(lists)
取消默认的圆点和序号可以这样写list-style:none;,
list的属性如下:
list-style-type:square; list-style-position:inside; list-style-image:url(image.gif); 可以缩写为一句:list-style:square inside url(image.gif);
转载于:https://www.cnblogs.com/zjfazc/archive/2012/07/06/2579924.html
转载:常用CSS缩写语法总结相关推荐
- [导入][转]常用CSS缩写语法总结
使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则如下: 颜色 16进制的色彩值,如果每两位的值相同,可以缩写一半,例如: #000000可以缩写为#000;#336699可以 ...
- 常用CSS缩写语法总结
使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则如下: 颜色 16进制的色彩值,如果每两位的值相同,可以缩写一半,例如: #000000可以缩写为#000;#336699可以 ...
- 常用CSS与Flex布局、媒体查询、JS事件控制css、VUE对象语法、Gride布局(待补全) CSS权重 页面适配笔记本缩放
css属性就是要用的多用的熟 知道的多 就像一本工具书 除了基础原理 剩下的就是知识面了 极力推荐MDN用过的人都说好~ 页面适配笔记本等自带缩放的场景 let t = window.devicePi ...
- Emmet (ZenCoding) 缩写语法
Emmet 使用类似于 CSS 选择器的语法描述元素在生成的文档树中的位置及其属性. 元素 可以使用元素名(如 div 或者 p)来生成 HTML 标签.Emmet 没有预定义的有效元素名的集合,可以 ...
- HTML+css 基础语法
title: HTML+css 基础语法 categories: HTML tags: [语法,HTML,css] 一.HTML 什是么网站? 网站(Website)开始是指在因特网上根据一定的规 ...
- 【CSS基础语法】CSS基础语法知识学习笔记汇总
CSS基础语法 前言 一.样式定义方式 1.html 2.css 二.选择器 1.html 2.css 三.颜色 1.html 2.css 四.文本 1.html 2.css 五.字体 1.html ...
- c++标准模板库STL【快速查找】【最全】【常用】【语法】
c++标准模板库STL[快速查找][最全][常用][语法] c标准模板库STL快速查找最全常用语法 vector- 变长数组 set-内部自动有序且不含重复元素 ...
- css宋体代码_前端开发必备的CSS命名规范与常用CSS代码集合
编辑 | web前端开发 来源 | web前端开发 我们在用html+css进行网页的排版布局时,经常会遇到CSS命名,如果是在团队多人协作开发时,团队里都会有自己的命名规范与要求. 但如果是自己在个 ...
- mysql怎样查表的模式_mysql常用基础操作语法(四)--对数据的简单无条件查询及库和表查询【命令行模式】...
1.mysql简单的查询:select 字段1,字段2... from tablename; 如果字段那里写一个*,代表查询所有的字段,等同于指定出所有的字段名,因此如果要查询所有字段的数据,一般都是 ...
最新文章
- 超车新势力齐聚港股,谁主沉浮?
- c++ 三次多项式拟合_非线性回归模型(一)--多项式回归
- gzip、bzip2和tar
- vi编辑器的学习使用(十三)
- 华为OJ平台——放苹果(典型整数划分问题)
- STL源码剖析 数值算法 heap算法
- idea 批量导入包
- HTML5 device access 设备访问
- Javascript:结合canvas、a标签根据url下载图片到本地
- 史上最全最新手机号码号段大全
- BT下载4K电影、视频
- 2022-08-22 步进电机驱动程序
- 国际奥林匹克运动会是怎么来的?
- 基于pytorch的OCR识别库
- 新手如何第一次编写 “Hello World“ Windows 驱动程序 (KMDF)
- tensorflow框架下,多进程model.predict(x)无响应/暂停/无输出
- 说说越婢加术汤(黄煌)
- java 多阶矩阵求逆_求N阶矩阵的逆矩阵 java
- MySQL:使用SQL语句删除所有索引
- 关于css中line-height(行高)设置无效的问题