Berikut adalah kode file css (simpan dengan nama new2.css) untuk membuat halaman web seperti di atas :

#wrapper {
margin: auto;
width: 997px;
border: 0;
}
#header {
height: 120px;
border: 1px solid blue;
margin-bottom:2px;
background:blue url('header.jpg');
}
#Gambarum {
float: left;
height: 63px;
width:61px;
margin-top:20px;
margin-left:50px;
border: 0;
background:red url('UM.PNG');
}
#Te {
float: left;
height: 35px;
width:300px;
margin-top:35px;
margin-left:5px;
}
#extra {
float: right;
height: 120px;
width:400px;
border: 0;
}
#atas {
float: left;
height: 25px;
width:350px;
margin-left:30px;
margin-top:2px;
border: 0;
}
#search {
clear:both;
float: right;
height: 20px;
width:300px;
margin-top:67px;
margin-right:20px;
border: 0;
}
#search1 {
float: left;
height: 15px;
width:120px;
margin-left:50px;
margin-top:4px;
border: 0;
}
#search2 {
float: right;
height: 17px;
width:110px;
margin-right:2px;
margin-top:4px;
border: 1px solid white;
background:white;
}
#inner {
float: left;
border: 0;
}
#sidebar {
float: left;
margin-right: 0px;
width: 250px;
height:420px;
border: 1px solid blue;
background:blue url('sidebar.jpg');
}
#Inner2 {
float: left;
width: 745px;
height: 420px;
border: 0;
}
#top{
height: 80px;
border: 0;
background:blue url('top.jpg');
}
#content {
float: left;
margin-top:10px;
margin-right:15px;
margin-left:15px;
width: 460px;
height: 323px;
border: 0;
}
#right {
float: left;
width: 250px;
height: 200px;
margin-top:10px;
border: 1px solid green;
background:blue url('right.jpg');
}

#footer {
margin:auto;
clear: both;
height: 80px;
width:997px;
border: 1px solid blue;
background:blue url('footer.jpg');
}
#leftmenu ul {
width: 250px;
list-style-type:none;
padding:0; margin:0;
}
#leftmenu a:link, #leftmenu a:visited, #leftmenu a:active {
padding-left: 15px;
text-decoration: none;
}
#leftmenu a {
padding: 5px 0px 5px 15px; display: block;
background: blue url('button.jpg');
margin: 0px 0px 1px; color: #ffffff;
}
#leftmenu a:hover {
background: #000066 no-repeat left center; color: #ffffff
}
.style2 {
font-size: 24px;
font-weight: bold;
color: #000099;
}
.style3 {
color: #0000CC;
font-weight: bold;
}
.style4 {
font-family: "Times New Roman", Times, serif;
font-size: xx-large;
color: #FFFFFF;
font-weight: bold;
}
.style6 {
font-family: "Times New Roman", Times, serif;
font-weight: bold;
}
.style7 {color: #FFFFFF}
.style8 {
font-family: "Times New Roman", Times, serif;
font-size: 16px;
font-weight: bold;
color: #FFFFFF;
}
.style10 {
color: #FFFFFF; font-size: 12px;
}
.style11 {
color: #000066;
font-weight: bold;
}


Dan kode html-nya sebagai berikut (simpan dengan nama 2.html)

<br /><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br /><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <br /><head> <br /><title>Desain Halaman Web</title> <br /><link rel="stylesheet" href="new2.css" type="text/css" /> <br /></head> <br /><body> <br /><div id="wrapper"> <br /> <div id="header"> <br /> <div id="LogoUM"> <br /> </div> <br /> <div class="style4" id="Elektro">TEKNIK ELEKTRO <br /> </div> <br /> <div id="extra"> <br /> <div class="style6" id="above"> <br /> <div align="right" class="style7"><a href="http://localhost/Modul 3/2.html" target="_blank" class="style7">Home</a> | <a href="http://localhost/Modul 3/2.html.html" target="_blank" class="style7">Sitemap</a> | <a href="http://localhost/Modul 3/2.html" target="_blank" class="style7">RSS</a> | <a href="http://localhost/Modul 3/2.html" target="_blank" class="style7">Contact</a> | <a href="http://localhost/Modul 3/2.html" target="_blank" class="style7">About Us</a> </div> <br /> </div> <br /> <div id="search"> <br /> <div class="style3" id="search1"> <br /> <div align="right"><em><strong> <br /> Search <br /> </strong></em></div> <br /> </div> <br /> <div id="search2"></div> <br /> </div> <br /> <br /> </div> <br /> </div> <br /> <br /> <div id="inner"> <br /> <div id="sidebar"> <br /> <div id="leftmenu"> <br /> <ul> <br /> <li> <br /> <div align="center"><a href="http://localhost/Modul 3/2.html">Home</a></div> <br /> </li> <br /> <li> <br /> <div align="center"><a href="http://localhost/Modul 3/2.html">News & Media </a></div> <br /> </li> <br /> <li> <br /> <div align="center"><a href="http://localhost/Modul 3/2.html">Tutorial</a></div> <br /> </li> <br /> <li> <br /> <div align="center"><a href="http://localhost/Modul 3/2.html">Tips and Trik</a></div> <br /> </li> <br /> <li> <br /> <div align="center"><a href="#">Download</a></div> <br /> </li> <br /> </ul> <br /> </div> <br /> </div> <br /> <div id="Inner2"> <br /> <div id="top"> <br /> </div> <br /> <div id="content"> <br /> <p class="style2">Lomba Desain Web</p> <br /> <p class="style3">4 Maret 2010 (07.00)</p> <br /> <p class="style3">Lorem ipsum dolor sit amet, consectetur adipisicing elit,<br /> <br /> sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<br /> <br /> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris<br /> <br /> nisi ut aliquip ex ea commodo consequat.</p> <br /> <p class="style3">Read more...</p> <br /> </div> <br /> <div id="right"> <br /> <p class="style2" align="center">Events</p> <br /> <p class="style3"><ul> <br /> <li><a href="http://mythaazkiya.blogspot.com">Lomba Panjat Tiang Listrik</a></li> <br /> <li><a href="http://mythaazkiya.blogspot.com">Lomba Tarik Kabel</a></li> <br /> <li><a href="http://mythaazkiya.blogspot.com">Balap Karung 10 KM</a></li> <br /> </ul> <br /> </div> <br /> <br /> <br /> </div> <br /> </div> <br /> </div> <br /> <div id="footer"> <br /> <p align="center" class="style3">© 2010 Romita Apriyani PTI '07 </p> <br /> </div> <br /></div> <br /></body> <br /></html> <br />

Gambar tersebut adalah tampilan desain layout halaman web dengan memanfaatkan CSS (Cascade Style Sheet).
Untuk dapat membuat desain layout seperti itu yang pertama adalah membuat file css kemudian simpan dengan nama new1.css sebagai berikut :

#wrapper {
margin: auto;
width: 750px;
border: 1px solid black;
}
#header {
height: 90px;
border: 1px solid black;
margin-bottom:5px;
}

#inner {
float: left;
margin: 10px 0;
width: 750px;
border: 1px solid green;
}

#inner2{
float: left;
margin-left:12px;
width: 589px;
height:310px;
border: 1px solid green;
}

#sidebar {
float: left;
margin-right: 0;
width: 145px;
height:310px;
border: 1px solid red;
}

#top{
height: 100px;
border: 1px solid black;
}
#content {
float: left;
margin-right:15px;
width: 385px;
height: 201px;
border: 1px solid red;
margin-bottom: 5px;
}
#right {
float: right;
width: 185px;
height: 155px;
border: 1px solid red;
}

#footer {
clear: both;
margin-top: 5px;
height: 79px;
border: 1px solid black;
}

Selanjutnya adalah membuat file html kemudian simpan dengan nama 1.html

<br /><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br /><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <br /><head> <br /><title>Desain Layout Halaman Web</title> <br /><link rel="stylesheet" href="new1.css" type="text/css" /> <br /></head> <br /><body> <br /><div id="wrapper"> <br /> <div id="header">Header</div> <br /> <br /> <div id="inner"> <br /> <div id="sidebar">Sidebar</div> <br /> <br /> <div id="inner2"> <br /> <div id="top">Top</div> <br /> <br /> <div id="content">Content</div> <br /> <br /> <div id="right">Right</div> <br /> </div> <br /> </div> <br /> <br /> <br /> <div id="footer"> <br /> Footer</div> <br /></div> <br /></body> <br /></html> <br />


Letakkan file css dan html pada satu folder kemudian jalankan melalui localhost.
Selamat mencoba. Semoga bermanfaat...

Dalam database, deadlock adalah sebuah situasi di mana dua atau lebih transaksi sedang menunggu satu sama lain untuk menyerahkan kunci. Sebagai contoh, Transaksi A memegang kunci pada beberapa baris dalam tabel Account dan perlu memperbarui beberapa baris dalam tabel Orders untuk menyelesaikan. Transaksi B memegang kunci pada baris dalam tabel Orders tetapi perlu untuk meng-update baris dalam tabel Account yang dipegang oleh A. Transaksi A tidak dapat menyelesaikan transaksi karena kunci pada Orders. Transaksi B tidak dapat menyelesaikan transaksi karena kunci pada Account. read more

To see more click here