| Kod Keyfi | En Yeni Kod Keyfiniz - Css ile kutular yapıyoruz

İÇERİK KODU:



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">

<style>
ul {
background: yellow;
margin: 12px 12px 12px 12px;
padding: 3px 3px 3px 3px;
}

li {
color: white;
background: blue;
margin: 12px 12px 12px 12px;
padding: 12px 0px 12px 12px;
list-style: none
}

#third {
border-style: dashed;
border-width: medium;
border-color: lime;
}

#fourth {
color: red;
background: #ffa500;
padding-top: 0.1em;
padding-bottom: 2em;
padding-left: 10em;
padding-right: 1em;
border-top-style: dotted;
border-bottom-style: solid;
border-left-style: double;
border-right-style: groove;
border-top-width: thin;
border-bottom-width: thick;
border-left-width: medium;
border-right-width: medium;
border-top-color: maroon;
border-bottom-color: aqua;
border-left-color: fuchsia;
border-right-color: red;
}

</style>

</HEAD>

<BODY>

<ul>
<li>first box</li>
<li>second box</li>
<li id="third">third box (with border)</li>
<li><div id="fourth">fourth box <br />(strange)</div></li>
<li>Attention! Some properties is not supported some browsers!</li>
</ul>
</BODY>
</HTML>

AÇIKLAMALAR :

CSS ile Tablo kullanmadan kutular.