CSS Outline Width

Posted on by master

Example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>CSS Outline</title>
    <style>
        p.one {
          border: 1px solid black;
          outline-style: solid;
          outline-color: red;
          outline-width: thin;
        }
        
        p.two {
          border: 1px solid black;
          outline-style: solid;
          outline-color: red;
          outline-width: medium;
        }
        
        p.three {
          border: 1px solid black;
          outline-style: solid;
          outline-color: red;
          outline-width: thick;
        }
        
        p.four {
          border: 1px solid black;
          outline-style: solid;
          outline-color: red;
          outline-width: 4px;
        }
        </style>
        </head>
</head>
<body>
    <p class=one>www.learscripting.org</p>
    <p class=two>www.learscripting.org</p>
    <p class=three>www.learscripting.org</p>
    <p class=four>www.learscripting.org</p>
</body>
</html>

Output:

Leave a Reply