border 外边框

简介: 语法: border: || || = | thin | medium | thick = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset 默认值:看每个独立属性 适用于:所有元素 继承性:无 动画性:看每个独立属性 计算值:看每个独立属性 相关属性:[ border-top ] || [ border-right ] || [ border-bottom ] || [ border-left ]   取值: : 设置或检索对象边框宽度。

语法:

border<line-width> || <line-style> || <color>

<line-width> = <length> | thin | medium | thick

<line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset

默认值:看每个独立属性

适用于:所有元素

继承性:无

动画性:看每个独立属性

计算值:看每个独立属性

相关属性:[ border-top ] || [ border-right ] || [ border-bottom ] || [ border-left ]

 

取值:

<line-width>: 设置或检索对象边框宽度。
<line-style>: 设置或检索对象边框样式。
<color>: 设置或检索对象边框颜色。

 

说明:

复合属性。设置对象边框的特性。参阅outline属性。

  • 如使用该复合属性定义其单个参数,则其他参数的默认值将无条件覆盖各自对应的单个属性设置。
  • 对应的脚本特性为border

 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>border 外边框</title>
    <style type="text/css">
    .parent{
        border-width: 1px 1px 2px 3px;
        border-style: solid;
        border-color: #0ff;
        width: 300px;
        height: 200px;
    }
    </style>
</head>
<body>
<div class="parent"></div>
</body>
</html>
开始做,坚持做,重复做
相关文章
|
4月前
|
前端开发
css如何将border线加到元素内部,占内边距,不占外边距
css如何将border线加到元素内部,占内边距,不占外边距
52 0
|
4月前
CSS3新增属性之圆角、盒阴影、字阴影
CSS3新增属性之圆角、盒阴影、字阴影
|
6月前
|
Web App开发 iOS开发
怎样给边框添加阴影?CSS3属性box-shadow帮你搞定!
CSS3 给边框添加阴影 -- box-shadow属性
144 1
怎样给边框添加阴影?CSS3属性box-shadow帮你搞定!
|
8月前
|
前端开发 开发者
CSS 实现半透明边框和多重边框
这篇文章整理了半透明边框、多重边框等的实现方式,供大家参考。学习这些例子还能帮助你深入掌握CSS中与边框相关的属性,包括 `border`,`outline`,`box-shadow` 等。
147 0
CSS 实现半透明边框和多重边框
|
前端开发
css:border-radius绘制边框圆角-全圆和椭圆
css:border-radius绘制边框圆角-全圆和椭圆
102 0
css:border-radius绘制边框圆角-全圆和椭圆
|
前端开发
一个元素纯CSS实现开关按钮【介绍box-shadow、单边或多重阴影、appearance属性】
借助checkbox表单元素、:checked伪类、::before/::after伪元素,就可以只需一个input[type="checkbox"]元素,通过纯CSS实现Switch开关效果的按钮.
368 0
一个元素纯CSS实现开关按钮【介绍box-shadow、单边或多重阴影、appearance属性】
|
前端开发
盒子模型 边框border 外边距 内边距
盒子模型 边框border 外边距 内边距
216 0
盒子模型 边框border 外边距 内边距
|
前端开发
css:box-shadow层级问题-相邻元素背景遮盖了阴影
css:box-shadow层级问题-相邻元素背景遮盖了阴影
102 0
css:box-shadow层级问题-相邻元素背景遮盖了阴影
|
前端开发
css:垂直方向外边距margin塌陷问题及解决
css:垂直方向外边距margin塌陷问题及解决
125 0
css:垂直方向外边距margin塌陷问题及解决
|
Web App开发 iOS开发
CSS3 box-shadow 效果大全(内阴影,外阴影,三边阴影,双边阴影,单边阴影,细线描边…)
CSS3 box-shadow 效果大全(内阴影,外阴影,三边阴影,双边阴影,单边阴影,细线描边…)
619 0