Code Thuộc tính outline-offset trong CSS

Trình soạn thảo - Code Thuộc tính outline-offset trong CSS

Kết quả - Code Thuộc tính outline-offset trong CSS

Tự code rồi chạy thử... Chạy Thử 
<!DOCTYPE html>
<html>
<head>
<title>Code Thuộc tính outline-offset trong CSS</title>
<style>
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
input{width:90%; height:35px; border:3px solid red; float:left; outline-style: dotted; outline-width:5px; outline-color:green; margin:5%; margin-bottom:20px;}
textarea{width:90%; height:50px; border:3px solid red; float:left; outline-style: dotted; outline-width:5px; outline-color:green; margin:5%; margin-bottom:20px;}
</style>
</head>
<body>

<h1>Code Thuộc tính outline-offset trong CSS</h1>

<p>Dùng để quy định khoảng cách của đường viền ngoài tới thuộc tính border trong phần tử HTML input, textarea:</p>

<!--outline-offset:15px;-->
<input style="outline-offset:15px;" type="text" placeholder="outline-offset:15px;">
<textarea style="outline-offset:15px;" placeholder="outline-offset:15px;">&lt;/textarea>

<!--outline-offset:5px;-->
<input style="outline-offset:5px;" type="text" placeholder="outline-offset:5px;">
<textarea style="outline-offset:5px;" placeholder="outline-offset:5px;">&lt;/textarea>

<!--outline-offset:1px;-->
<input style="outline-offset:1px;" type="text" placeholder="outline-offset:1px;">
<textarea style="outline-offset:1px;" placeholder="outline-offset:1px;">&lt;/textarea>

<input type="text" placeholder="">
<textarea  placeholder="">&lt;/textarea>

</body>
</html>