Web标准基础教程:CSS简写指南(2)
来源:前端观察 时间:2010-04-02 12:47:00
边框(border)
border是个比较灵活的属性,它有border-width、border-style、border-color三个子属性。
border-width:数字+单位; border-style: none || hidden || dashed || dotted || double || groove || inset || outset || ridge || solid ; border-color: 颜色 ; |
它可以按照width、style和color的顺序简写:
border:5px solid #369; |
有的时候,border可以写的更简单些,有些值可以省掉,但是请注意哪些是必须的,你也可以测试一下:
border:groove red; //大家猜猜这个边框的宽度是多少? border:solid; //这会是什么样子? border:5px; //这样可以吗? border:5px red; //这样可以吗?? border:red; //这样可以吗??? |
通过上面的代码可以了解到,border默认的宽度是3px,默认的色彩是black——黑色。border的缩写中border- style是必须的。
同时,还可以对每条边采用缩写:
border-top:4px solid #333; border-right:3px solid #666; border-bottom:3px solid #666; border-left:4px solid #333; |
还可以对每个属性采用缩写:
border-width:1px 2px 3px; //最多可用四个值,缩写规则类似盒子大小的缩写,下同 border-style:solid dashed dotted groove; border-color:red blue white black; |
outline
outline类似border,不同的是border会影响盒模型,而outline不会。
outline-width:数字+单位; outline-style: none || dashed || dotted || double || groove || inset || outset || ridge || solid ; outline-color: 颜色 ; |
可以缩写为:
outline:1px solid red; |
同样,outline的简写中,outline-style也是必须的,另外两个值则可选,默认值和border相同。
标签:CSS简写,缩写,web标准,教程,CSS优化
0
投稿
猜你喜欢
Python程序运行原理图文解析
2023-08-09 03:27:31
python matplotlib如何给图中的点加标签
2023-02-23 12:16:47
python密码错误三次锁定(实例讲解)
2022-03-02 07:51:23
asp.net 使用Silverlight操作ASPNETDB数据库
2024-01-20 15:50:24
Python2.x中文乱码问题解决方法
2023-09-20 14:35:35
Python实现文字pdf转换图片pdf效果
2021-03-10 23:20:03
Python实战整活之聊天机器人
2022-10-13 09:57:50
ES6入门教程之let、const的使用方法
2024-05-22 10:36:59
Python实现在Linux系统下更改当前进程运行用户
2023-03-27 02:53:33
python3.8+django2+celery5.2.7环境准备(python测试开发django)
2022-08-19 06:17:14
mysql本地登录无法使用端口号登录的解决方法
2024-01-25 06:51:30
Python使用cx_Freeze库生成msi格式安装文件的方法
2023-02-05 12:26:16
文字解说Golang Goroutine和线程的区别
2023-10-15 18:56:36
空行不空格式排版组织原理
2010-05-03 14:46:00
在Django框架中设置语言偏好的教程
2022-01-18 22:47:35
分享Bootstrap简单表格、表单、登录页面
2024-04-10 13:50:42
Python遍历列表时删除元素案例
2023-09-03 16:08:09
mysql 安全管理详情
2024-01-18 05:58:00
python实现字符串和字典的转换
2023-03-02 02:57:18
SQL Server数据表字段自定义自增数据格式的方法
2024-01-13 03:23:45