Berikut adalah Script CSS dari tampilan diatas (disimpan dengan nama studsus.css):
body{
margin :10px auto;
width: 1000px;
height:700px;
}
header,nav,section,footer,article,aside{
display:block;
border: 1px;
}
header {
height: 100px;
border: 1px solid green;
}
nav{
width: 1000px;
height: 50px;
border: 1px solid blue;
}
section{
width: 1000px;
height: 350px;
border: 1px solid red;
}
article{
margin-top: 20px ;
margin-left: 20px ;
width: 450px;
height: 280px;
border: 1px dashed orange;
}
aside {
margin-top: -283px ;
margin-left: 500px ;
width: 450px;
height: 280px;
border: 1px dashed black;
}
footer {
height: 30px;
border: 1px solid green;
}
Untuk Scriptnya bisa dilihat berikut ini :
<!DOCTYPE HTML> <html lang="en"> <head> <title>Desain Layout</title> <link rel="stylesheet" href="studsus.css" type="text/css" /> </head> <body> <header>header</header> <nav>nav</nav> <section> <article>article</article> <aside>aside</aside> section </section> <footer>footer</footer> </body> </html>
Tidak ada komentar:
Posting Komentar