標籤：不同 idt 頁面 body height title 面試官 otto 複合
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>邊框</title>
<style type="text/css">
div{
width: 300px;
height: 300px;
/*border: 1px solid red; 複合樣式*/
/*單一樣式*/
border-width: 1px 2px 3px 4px;
border-style: solid dashed dotted solid;
border-color: red blue black pink;
/*四個值依次分別對上、右、下、左賦值*/
/*當只有兩個值時一次分別對上/下、左/右賦值*/
/*當放三個值時依次分別對上、左/右、下賦值*/
border-top: 10px solid yellow;
/*單獨對上邊框進行賦值，
border-bottom為下邊框
border-left為左邊框
border-right為右邊框
* */
border-bottom-color: hotpink;
/*單獨對下邊框顏色進行複製*/
}
</style>
</head>
<body>
<div>
</div>
</body>
</html>
注意：邊框其實不是一個矩形，當你把上邊變得顏色設定的不同時你會發現變得是一個梯形，而如果你把div的寬和高設定為0的話，這個有變得不是梯形，他的上低也會變為0，成為一個三角形，這個在面試前端工作時，面試官有可能會問到
html頁面邊框的另一種寫法
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
