CSS边框border样式缩写
类别:Web前端 浏览量:10900
时间:2013-8-1 CSS边框border样式缩写
CSS边框border样式缩写在 HTML 中,我们使用表格来创建文本周围的边框,但是通过使用 CSS 边框属性,我们可以创建出效果出色的边框,并且可以应用于任何元素。元素外边距内就是元素的的边框 (border)。元素的边框就是围绕元素内容和内边据的一条或多条线。每个边框有 3 个方面:宽度、样式,以及颜色。
一、边框样式合成
/*边框各属性独立的样式进行CSS压缩合并*/ border-color:#000; border-style:solid; border-width:1px /*可以简写为:*/ border:1px solid #000 /*左边框各属性独立的合并*/ border-left-color:#000; border-left-style:solid; border-left-width:1px /*可以简写为*/ border-left:1px solid #000
二、三边有边框,一边无边框简写缩写
/*上、下、左相同边框样式,右边无边框*/ border-left:1px solid #000; border-top:1px solid #000; border-bottom:1px solid #000; /*简写为:*/ border:1px solid #000;border-right:0
三、附带列出边框border的其它属性
属性 | 描述 |
---|---|
border | 简写属性,用于把针对四个边的属性设置在一个声明。 |
border-style | 用于设置元素所有边框的样式,或者单独地为各边设置边框样式。 |
border-width | 简写属性,用于为元素的所有边框设置宽度,或者单独地为各边边框设置宽度。 |
border-color | 简写属性,设置元素的所有边框中可见部分的颜色,或为 4 个边分别设置颜色。 |
border-bottom | 简写属性,用于把下边框的所有属性设置到一个声明中。 |
border-bottom-color | 设置元素的下边框的颜色。 |
border-bottom-style | 设置元素的下边框的样式。 |
border-bottom-width | 设置元素的下边框的宽度。 |
border-left | 简写属性,用于把左边框的所有属性设置到一个声明中。 |
border-left-color | 设置元素的左边框的颜色。 |
border-left-style | 设置元素的左边框的样式。 |
border-left-width | 设置元素的左边框的宽度。 |
border-right | 简写属性,用于把右边框的所有属性设置到一个声明中。 |
border-right-color | 设置元素的右边框的颜色。 |
border-right-style | 设置元素的右边框的样式。 |
border-right-width | 设置元素的右边框的宽度。 |
border-top | 简写属性,用于把上边框的所有属性设置到一个声明中。 |
border-top-color | 设置元素的上边框的颜色。 |
border-top-style | 设置元素的上边框的样式。 |
border-top-width | 设置元素的上边框的宽度。 |
您可能感兴趣
- css浮动布局和盒子(css 盒模型 文档流 几种清除浮动的方法实例详解)
- css如何设置表格样式
- cssfloat和position功能(理解CSS浮动float、定位position)
- css怎么设置图片横着(一行css代码解决图片统一大小后的拉伸问题object-fit)
- css用clearfix清除浮动
- css代码大全登录界面(Div+CSS仿微信公众平台登录页面)
- css反选怎么设置(CSS 新特性 contain控制页面的重绘与重排问题)
- css3颜色详解(CSS3混合模式mix-blend-mode/background-blend-mode简介)
- javascript编写的小游戏(CSS3 实现NES游戏机的示例代码)
- css3导航条推荐(使用CSS3制作倾斜导航条和毛玻璃效果)
- css空白边叠加
- css3弹出动画效果(CSS3实现跳动的动画效果)
- css定位总结(css中的三种基本定位机制)
- 制作css3动画应使用哪个样式属性(CSS3中Transform动画属性用法详解)
- ie浏览器css颜色兼容(IE8的css hack9 使用说明)
- css3网格布局图(详解CSS3 弹性布局快速入门)
- 熊猫中国国宝(熊猫国宝酒53酱香)
- 春节会放假几天(春节会放假吗)
- 小浴室,大民生 缙云3200多户困难群众洗上免费热水澡(小浴室大民生缙云3200多户困难群众洗上免费热水澡)
- 元旦闲谭(元旦闲谭)
- 息烽 这个村 治垃圾 有招 人人争当卫生模范(息烽这个村治垃圾)
- 今天要吃什么(今天要吃什么菜)
热门推荐
- css3轮播案例(纯CSS3实现图片无间断轮播效果)
- python爬虫10分钟教程(浅谈Python爬虫基本套路)
- python yield 使用浅析(yii框架使用分页的方法分析)
- ubuntu下mysql安装教程(Ubuntu 20.04 安装和配置MySql5.7的详细教程)
- 云服务器实例和配置(运维必须知道的关于云服务器的十个问题)
- thinkphp数据库使用(thinkphp3.2同时连接两个数据库的简单方法)
- html5带放大镜的搜索代码(html5借用repeating-linear-gradient实现一把刻度尺ruler)
- SqlServer索引的原理与应用详解(SqlServer索引的原理与应用详解)
- pandas 导入数据库(详解pandas的外部数据导入与常用方法)
- canvas心形水波(Canvas波浪花环的示例代码)