サマリー：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><style>.box {width: 200px;height: 200px;border: 2px soli
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.box {
width: 200px;
height: 200px;
border: 2px solid lightcoral;
}
.box1 {
width: 200px;
height: 200px;
border-top: 1px dotted red;
border-right: 1px dashed #ff6500;
border-bottom: 1px solid rgb(255,254,0);
border-left: 1px double lightblue;
margin-top: 20px;
}
.box2 {
width: 200px;
height: 200px;
border: 20px solid blue;
border-radius: 10px;
border-image: url(static/images/2.png);
margin-top: 20px;
}
.box3 {
width: 200px;
height: 200px;
border: 1px solid green;
border-radius: 50%;
box-shadow: 5px 10px 10px #ccc;
}
</style>
</head>
<body>
<div class="box"></div>
<div class="box1"></div>
<div class="box2"></div>
<div class="box3"></div>
</body>
</html>
<!-- css邊框樣式和顏色
css中用border來指定一個元素的邊框樣式和顏色，
語法如：border: 1px(邊框的粗細) solid（邊框線條類型） red（邊框的顏色）;
一、border-style值：
1. none: 默認無邊框
2. solid: 定義實線邊界
3. double: 定義兩個邊界
4. dotted: 定義一個點線框
5. dashed: 定義一個虛線框
6. groove: 定義3D溝槽邊界。效果取決于邊界的顏色值
7. ridge: 定義3D脊邊界，效果取決于邊界的顏色值
8. inset: 定義一個3D嵌入邊框，效果取決于邊界的顏色值
9. outset: 定義一個3D突出邊框。效果取決于邊界的顏色值
二、邊框的寬度
1. 指定長度值：比如2px或 0.1em
2. 使用3個關鍵字之一，它們分別是thin ,medium(默認值) ，thick.
三、邊框的顏色（有三種指定顏色的方法）
1. name － 指定顏色的名稱，如“red”
2. RGB －指定顏色的RGB值，如：rgb(255,255,255)
3. Hex -指定16進制顏色值，如："#ff6500"
四、單獨設置邊框的各邊
1. 邊框左邊： border-left
2. 邊框上邊： border-top
3. 邊框右邊： border-right
4. 邊框下邊： border-bottom
五、css3新增邊框樣式
1. 邊框圓角： border-radius 如： border-radius: 5px; border-radius: 50%;
2. css3盒陰影： box-shadow 如：box-shadow: 10px 10px 5px red;
3. css3邊界圖片： border-image -->
添削の先生：天蓬老師添削時間：2019-02-03 15:18:41
先生のまとめ：邊框的四條條的樣式簡寫也非常的重要, 抽空學習一下