HTML
border-style 屬性指定邊框的樣式。
border: 10px ridge pink border-radius:50% 50% 50% 50%
border: 10px ridge pink border-radius:40px 40px 40px 40px
左邊框為實線 border-left-style:solid 上邊框為實線 border-top-style:dashed 下邊框為虛線 border-right-style:dotted 且顏色為綠色 border-bottom-style:double
border: 10px solid brown; border-radius: 100px; height: 100px ; width: 100px;
border: 10px solid gold; border-radius: 150px; height: 150px ; width: 100px
border: 10px solid bisque; border-radius: 50px 0 0 50px; width:50px ; height:100px;
border: 10px solid blueviolet; border-radius: 0 50px 50px 0 ; width: 50px;height: 100px;
border: 1px solid lawngreen; border-radius: 50px 50px 0 0; width:100px ; height:50px;
border: 2px solid orchid; border-radius: 0 0 50px 50p ; width: 100px;height: 50px;
border: 5px solid bisque; border-radius: 50px 0 50px 0 ; width:100px ; height:50px;
border: 3px solid salmon; border-radius: 0 50px 0 50p ; width: 100px;height: 50px;
文字陰影 {text-shadow: 向右移動 向下移動 模糊度 陰影色 }, 陰影效果 { text-align: center; font-weight : bold; text-shadow:5px 5px 10px black ; } 字型輪廓{ color: white; letter-spacing: 3px; font-weight:bold ; text-shadow: -2px 0 0 black, 0 2px 0 black, 2px 0 0 black, 0 -2px 0 black; } 活動陰影{ animation: mymove 5s infinite; } @keyframes mymove{10% {text-shadow:10px 10px 20px gold;} 25% {text-shadow:0px 20px 20px red; } 35% {text-shadow:-10px 10px 20px gold; } 45% {text-shadow:-10px 10px 20px orangered; } 55% {text-shadow:-10px 1px 20px orange; } 65% {text-shadow:-10px -10px 20px tomato; } 75% {text-shadow:10px -10px 20px darkorange; } 85% {text-shadow:0px -10px 20px red; } 100% {text-shadow:10px 0px 20px deeppink; } } }
CSS padding: 留白 邊框內的部分。一個盒子有四個邊, 所以我們可以對這四個邊的留白逐一設定。 CSS : padding: [上] [右] [下] [左] padding: [上下] [左右] padding: [上] [左右] [下] padding: [四個邊同樣値] CSS padding 的四個邊獨立寫法 : padding-top :與上個邊的距離 padding-right :與右方個邊距離 padding-bottom:與下方個邊距離 padding-left :與左個邊的距離 padding 可以的值有 auto、%、em、px、pt
例如 DIV span img 等 的外邊界距離 , CSS : margin : [上] [右] [下] [左] margin : [上下] [左右] margin : [上] [左右] [下] margin : [四個邊同樣値] CSS margin 的四個邊獨立寫法 margin-top:與上方元素的距離 margin-right:與右方元素的距離 margin-bottom:與下方元素的距離 margin-left:與左方元素的距離 margin 可以的值有 auto、%、em、px、pt