☄ EXPOLORE MIND ⚜ Tutorial ? JIQA Biography News
PRV MENU NEXT

Setting the Border of an HTML Element Box

02-02-18 Course- CSS-Simple

You can set different widths, styles, and colors for all the four borders of an HTML element box using the specific border properties. For example, you can set the widths of top and right borders of the HTML element box, using the border-top-width and border-right-width properties, respectively. You can also set the width, style, and color of all four borders of an HTML element box in one declaration, using the border shorthand property.

Let’s do the following steps to set the width style, and color of the borders or an HTML element box by using the border property:


<!DOCTYPE html>
<html>
<head>
<title>Setting the borders of an HTML Element Box</title>
    <style type=”text/css”>
    div {border: thin dashed #ff0000}
    div1 {}
    </style>
</head>
<body>
    <h2>Example of Setting border</h2>
    <div>
    <h4>Here is a list of students who are passed in the online exam:</h4>
    <ul>
    <li>Sumit Saxena</li>
    <li>Rohit Jandial</li>
    <li>Avantika Srivastava</li>
    <li>Sanchita Sarkar</li>
    </ul>
    </div>
    <br>
    <div style=”border-width:4px; border-style:solid; border-color:#239006;”>
    <h4<Here is a list of students who are not passed in the online exam: </h4>
    <ul>
    <li>Amitabh Kumar</li>
    <li>Jitendar Arya</li>
    <li>Shekhar Sharma</li>
    <li>Allen Jolt</li>
    </ul>
    </div>
</body>
</html>

Save the document with the name borders.html and open with browser.

PRV MENU NEXT