边框三要素
边框三要素
border属性
border属性需要三个要素：线宽度、线型、线颜色，示例如下：
border: 1px solid red;示例代码分别表示线宽度为1px、线型为实线、线颜色为红色。
线型
| 线型值 | 意义 |
|---|---|
| solid | 实线 |
| dashed | 虚线 |
| dotted | 点状线 |
示例如下：
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>边框title><style>div {width: 150px;height: 150px;margin-bottom: 10px;}.box1 {border: 3px dashed blue;}.box2 {border: 3px solid red;}.box3 {border: 3px dotted green;}style>
head>
<body><div class="box1">div><div class="box2">div><div class="box3">div>
body>
html>网页效果如下：
边框的三要素小属性
| 小属性 | 意义 |
|---|---|
| border-width | 线宽 |
| border-style | 线型 |
| border-color | 线颜色 |
示例如下：
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>边框title><style>div {width: 150px;height: 150px;border-width: 3px;border-style: dotted;border-color: red;style>
head>
<body><div>div>
body>
html>网页效果如下：
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！