<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<HTML>
<HEAD>
<TITLE>Examples of margins, padding, and borders</TITLE>
<STYLE type="text/css">
ul {
background:#404242;
margin: 12px 12px 12px 12px;
padding: 3px 3px 3px 3px;
}
li{
color: white;
background: #808686;
margin: 12px 12px 12px 12px;
padding: 12px 0px 12px 12px;
list-style: none
}
li.withborder {
border-style:double;
border-width: medium;
border-color:lime;
}
.text_shadow {
</STYLE>
</HEAD>
<BODY style="width:300px;">
<div class="text_shadow">
<UL>
<LI><b>Example of margins, padding, and borders</b>
<LI class="withborder"><b>Note that:</b><br>
* The margins of the LI boxes are transparent — margins are always transparent — so the background color (yellow) of the UL padding and content areas shines through them.
<br>* The second LI element specifies a dashed border (the 'border-style' property).
</UL>
</div>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>Examples of margins, padding, and borders</TITLE>
<STYLE type="text/css">
ul {
background:#404242;
margin: 12px 12px 12px 12px;
padding: 3px 3px 3px 3px;
}
li{
color: white;
background: #808686;
margin: 12px 12px 12px 12px;
padding: 12px 0px 12px 12px;
list-style: none
}
li.withborder {
border-style:double;
border-width: medium;
border-color:lime;
}
.text_shadow {
color: #fff;
background-color: #808686;
text-shadow: 1px 1px 1px #ddccb5;
font-size: 15px;
}
</STYLE>
</HEAD>
<BODY style="width:300px;">
<div class="text_shadow">
<UL>
<LI><b>Example of margins, padding, and borders</b>
<LI class="withborder"><b>Note that:</b><br>
* The margins of the LI boxes are transparent — margins are always transparent — so the background color (yellow) of the UL padding and content areas shines through them.
<br>* The second LI element specifies a dashed border (the 'border-style' property).
</UL>
</div>
</BODY>
</HTML>
Output:-
No comments:
Post a Comment