html5
/* 邊框寬度/邊框樣式/邊框顏色 */
border-width:10px;
border-style: inset;
border-color: black;
/* 定義邊應用邊框樣式 */
border-top-color: aqua;
border-top-style: none;
border-top-width: medium;
/* 一次指定 */
border: medium solid aqua;
/* 建立圓角邊框,需要指定2個值(長度，百分比均可)
第乙個值:水平曲線半徑
第二個值:垂直曲線半徑
border-top-left-radius：
border-top-right-radius
border-bottom-left-radius
border-bottom-right-radius
border-radius：一次設定4個角的簡寫屬性，1對or4對長度值or百分比值。用」/」符號分割
*/
border-top-left-radius: 20px 15px;border-radius: 20px/15px;border-radius: 50% 20px 25% 5em/25% 15px 40px 55%;border-image-source:設定影象**，url或者none
border-image-slice:設定切分影象的偏移，1~4個長度值or百分數
border-image-width：影象邊框寬度，1~4個長度值or百分數 or auto
border-image-outset:指定邊框向外擴充套件的部分,1~4個長度值or百分數
border-image-repeat:填充邊框區域的模式,(stretch,repeat,round)3個值中的1個or2個
stretch:拉伸切分圖填滿整個空間，預設值
repeat:平鋪切分圖填滿整個空間，會導致截斷
round:不截斷切分圖情況下，平鋪切分圖並拉伸填滿整個空間
space：不截斷切分圖，平鋪切分圖並在之間保留一定的間距填滿整個空間
border-image:設定所有的屬性值
提供2個值表示水平方向和垂直方向的偏移量，乙個值則表示4個偏移量都一樣
*/
border-image: url(./ceuqkmmnrz4g.png) 30/50px;
border-image: url(./ceuqkmmnrz4g.png) 30/50px;
border-image: url(./ceuqkmmnrz4g.png) 30/50px;
/* background-color 設定背景色
background-image 背景
background-size 背景影象尺寸
background-repeat 重複方式
background-position: 背景影象位置 :這裡設定的是距離左邊界30px，頂部邊界10px
background-attachment 背景附著方式：如內容滾動，背景不滾動等
background-origin：指定背景顏色&背景影象應用的位置
background-clip:裁剪樣式決定背景顏色&影象在元素盒子中繪製的區域.決定背景的那一部分可見，裁剪盒子之外的部分一律捨棄
*/
/* border: 300px double black; */
width: 600px;
height: 900px;
background-color: aqua;
background-image: url(./ceuqkmmnrz4g.png);
background-size: 300px 400px;
background-repeat: repeat;
background-position: 30px 10px;
background-attachment: fixed;
background-origin: border-box;
background-clip: content-box;
background: aqua repeat;
/############# 建立盒子陰影 /
/* box-shadow:hoffset voffset blur spread color inset;可定義多個陰影，使用逗號隔開即可
hoffset:水平偏移值，負值表示陰影向左偏移
voffset：垂直偏移值，負值表示陰影向上偏移
blur：模糊值，預設0清晰。
spread：陰影向盒子4周延伸值,負值表示沿相反方向縮小
color:陰影顏色
inset：外部陰影設定為內部陰影，內嵌到盒子中。 */
width: 15px;
height: 50px;
border: 10px double red;
box-shadow: 1px 5px 10px 5px black, 4px 4px 6px gray inset;
margin-left: 150px;
outline-color: 輪廓顏色
outline-offset: 距離邊框邊緣偏移值
outline-style: 樣式
outline-width: 輪廓寬度
outline：顏色，樣式，寬度
*/
width: 15px;
height: 50px;
margin-left: 150px;
outline-color: aqua;
outline-offset: 10px;
outline-style: double;
outline-width: thick;
outline: aqua solid thick;
哈哈圓角邊框
圓角邊框
圓角邊框
圓角邊框
背景樣式 檢索或設定物件的背景影象的尺寸大小。 該屬性提供2個引數值(特性值cover和contain除外)。
如果提供兩個，第乙個用於定義背景影象的寬度，第二個用於定義背景影象的高度。
如果只提供乙個，該值將用於定義背景影象的寬度，第2個值預設為auto，即高度為auto，此時背景圖以提供的寬度作為參照來進行等比縮放。
對應的指令碼特性為backgroundsize。
圓角邊框
圓角邊框
CSS邊框和背景
1 邊框線條樣式 none 沒有邊框 dashed 破折線邊框 dotted 圓點線邊框 double 雙線邊框 groove 槽線邊框 inset 使元素內容具有內嵌效果的邊框 outset 使元素內容具有外凸效果的邊框 ridge 脊線邊框 solid 實線邊框 2 圓角邊框樣式 border ...
設定樣式 背景和邊框
一 背景 background 背景顏色 background color red 簡寫background red 背景background image url 路徑 簡寫background url 背景平鋪 1 平鋪 瀏覽器預設 2 不平鋪 background repeat no repea...
背景邊框不規則背景
主要是樣式 iphone xr不相容 minjiancs a下面這種方法不靈活 html doctype html html lang en head meta charset utf 8 meta name viewport content width device width,initial s...