標簽是文本輸入框,默認帶有外邊框樣式,下面我們聊聊input邊框顏色怎么設置?" />
更新時間:2021-09-07 來源:黑馬程序員 瀏覽量:
<input>標簽是文本輸入框,默認帶有外邊框樣式,下面我們聊聊input邊框顏色怎么設置?
修改前的效果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>input外邊距</title>
<style>
* {
margin: 10px auto;
}
div {
width: 1000px;
}
</style>
</head>
<body>
<div>
<input type="text" value="請輸入內容">
</div>
</body>
</html>如何修改input外邊距?
修改外邊距顏色:outline-color: 顏色;
如何修改input外邊距寬度?
修改外邊距寬度為4像素:outline-width : 4px;
如何清除input外邊默認樣式?
清除外邊距樣式:outline-style: none;
案例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>input外邊距</title>
<style>
* {
margin: 10px auto;
}
div {
width: 1000px;
}
/*清除input默認樣式 */
input {
outline-style: none;
}
</style>
</head>
<body>
<div>
<input type="text" value="請輸入內容">
</div>
</body>
</html>
清除后的效果
猜你喜歡: