Applying an appropriate border to the HTML element of your page can improve the appearance of your webpage.
We have a lot of scenarios where we can apply the border to a few of our elements.
We can achieve this by using the border properties of CSS.
Let us discuss more about border properties.
Let us see the usage of border property in the below example.
The border is applied to the div elements with different border-styles and border-width in the below example.
Demo :
<!doctype html>
<head>
<title>Home Page</title>
<meta charset="UTF-8">
</head>
<body>
<table border="1" align="center">
<tr>
<td width="800px" height="100px">
<h2>Global Bank</h2>
</td>
</tr>
</table>
<table border="1" align="center" cellpadding="2">
<tr>
<td width="700px">
<section>
<h3>Welcome to Global Bank Home Page !</h3><br/>
<p><em>Global Bank</em> is a international bank which has branches in various cities of
various country.</p>
</section>
<p>
This application automates the banking process.Using this application the admin can
easily create new accounts and the customers can login to view their account details.
</p><br />
<table align="center" border="4 solid" bordercolor="#8598CC">
<tr>
<td>
<h4 align="center">Login</h4>
<form name="loginForm" action="Details.html">
<table cellpadding="5">
<tr>
<td align="right">User Name</td>
<td><input type="text" /></td>
</tr>
<tr>
<td align="right">Password</td>
<td><input type="password" /></td>
</tr>
<tr>
<td colspan="2" align="center"><input type="submit" value="Login">
</td>
</tr>
</table>
</form>
</td>
</tr><br/>
</table><br/>
<p>Submit online application for new account here <a href="signUp.html">Create Account</a>
</p>
</td>
</tr>
</table>
<table border="1" align="center">
<tr>
<td width="800px" height="30px">
<footer>
<h2>© Global Bank</h2>
</footer>
</td>
</tr>
</table>
</body>
</html>
body{background-color:lightgrey;}