TUGAS PRAKTIKUM
Ini CSS-nya
body {margin: 10px auto;
width: 1350px;
}
header,nav,section,footer {
display:block;}
header {
height:200px;
width:1350px;
background-image:url(head.jpg);}
nav{float:left;
width:1350px;
height:60px;
background:blue;
margin-right:5px;}
.nav #button a:active{
background-color:white;
}
.nav #search{
margin:5px;
margin-left:700px;
}
section{float:left;
width:1350px;
height:517px;
background-image:url(chelsea.jpg);}
side1 {float:left;
height:360px;
width:480px;
border:6px solid white;
margin:20px;}
side2 {float: right;
height:358px;
width:780px;
border:2px dashed black;
}
footer {width:1350px;
clear:both;
height:60px;
background-image:url(foot.jpg);}
ul li a {display: block;
text-decoration:none;
line-height:2px;
color:#F90;
padding:10px;
background:#505050;
margin:1px 1px;}
ul {margin:1;
padding:0;
list-style: none;}
ul li {position: relative;
float: left;
width:100px;}
li ul {position: absolute;
top: 1px;
display: none;}
ini HTML-nya
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-
transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>CHELSEA FC</title>
<link rel="stylesheet" href="tgsprak.css" type="text/css">
<link rel="shortcut icon" href="icon.ico" type="image/x-icon">
</head>
<body>
<header>
<div>THE BLUES CHELSEA</div>
</header>
<nav>
<font face="comic sans" size="4"><div align="center">
</div>
<div class="nav">
<ul id="button">
<li><a href="#">home</a></li>
<li><a href="#">tips</a></li>
<li><a href="#">articles</a></li>
<li><a href="#">downloads</a></li>
<li><a href="#">comment</a></li>
</ul>
<font color="#F90" face="Comic Sans MS" size="3">
<div align ="right">
<div id="search">search : <input></input></div>
</div></div></font>
</nav>
<font face="comic sans" size="3">
<font color="#F90" face="Comic Sans MS" size="2">
<section>
<side1>
<img src="chel.jpg" width: 360px, height: 480px;>
</side1>
<side2>
<font color="#FF9" face="Comic Sans MS" size="2">
<br>
Chelsea F.C. (Chelsea Football Club), juga dikenal sebagai The Blues atau sebelumnya sebagai The Pensioners (London F.C.), adalah sebuah klub sepak bola Inggris yang bermain di Liga Utama Inggris dan bermarkas di kota London. Klub ini didirikan oleh H.A. Mears pada tahun 1905, dan memiliki lapangan sendiri yang dapat menampung sekitar 42.360 penonton, bertempat di Fulham, London Barat.
Chelsea sudah menghabiskan banyak sejarah dalam dunia sepak bola Inggris, dan mengalami kesuksesan sebanyak dua periode, sepanjang tahun 1960-an dan awal 1970-an, kemudian pada akhir 1990-an hingga saat ini. Chelsea telah memenangi empat gelar Liga Utama Inggris (1954-55, 2004-05, 2005-06, 2009-2010), enamPiala FA (1970, 1997, 2000, 2007, 2009, 2010), empat Piala Liga (1965, 1998, 2005, 2007), dan dua Piala Winners (1971, 1998).
Pada musim 2009 - 2010, Chelsea berhasil menjuarai Liga Utama Inggris (EPL) dan Piala FA (FA Cup).
Pada musim kompetisi 2009 - 2010, striker Chelsea, Didier Drogba berhasil mendapatkan Golden Boot dengan meraih 29 gol, 3 gol lebih banyak dibandingkan penyerang Manchester United, Wayne Rooney (26 gol). Persaingan perebutan Golden Boot terasa begitu sengit hingga laga terakhir EPL digelar.
Chelsea memiliki beberapa pemain-pemain Inggris yang dianggap terbaik saat ini, di antaranya yaitu John Terry (kapten) sebagai defender terkuat, Frank Lampard sebagai pemain tengah (midfielder) mesin gol, dan Ashley Cole sebagai wingback terbaik.</br>
<b>Prestasi</b>
4 Liga Utama Inggris (1955, 2005, 2006, 2010)</br>
2 Divisi Championship (1984, 1989)</br>
6 Piala FA (1970, 1997, 2000, 2007, 2009, 2010)</br>
4 Piala Liga (1965, 1998, 2005, 2007)</br>
4 Community Shield (1955, 2000, 2005, 2009)</br>
2 Piala Winners (1971, 1998)</br>
1 Piala Super Eropa (1998)</br>
</font></side2>
<footer>
<font color="black" face="Comic Sans MS" size="4"><div align="center">
<table color="#fffff" cellpadding="5" width="1350",height="250">
<tbody><tr><td align="right" width="250">
</td>
<td><hr color="#fffff" size="1" width="950"></td><td width="250"></td></tr>
</tbody></table>
copyright © LiGhT RaNgerS Rz_Jzy
</div></font></footer><font color="black" face="Comic Sans MS" size="4">
</font></font></font></font></font></font>
</body>
</html>
STUDI KASUS
Ini CSS-nya
body{
margin: 10px auto;
width:950px
}
.header{
border:1px solid green;
height:100px;
}
.nav{
border:1px solid blue;
height:70px;
}
.nav #button a:active{
background-color:aqua;
}
.nav #search{
margin:5px;
margin-left:700px;
}
.section{
border:1px solid black;
}
.section #article{
border:1px dotted yellow;
float:left;
width:650px;
height:390px;
margin-left:8px;
margin-top:10px;
margin-right:15px;
margin-bottom:0px;
}
.section #sidebar{
border:1px dotted red;
margin-left:650px;
margin-top:10px;
margin-right:;
margin-bottom:0px;
width:240px;
height:390px;
}
.footer{
border:1px solid brown;
height:20px;
}
ul li a {display: block;
text-decoration:none;
line-height:2px;
color:#dedede;
padding:10px;
background:#505050;
margin:1px 1px;}
ul {margin:1;
padding:0;
list-style: none;}
ul li {position: relative;
float: left;
width:90px;}
li ul {position: absolute;
top: 1px;
display: none;}
ini HTML-nya
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-
transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
lang="en">
<head>
<link rel="stylesheet" href="SK4.css" type=text/css />
<title>Studi Kasus</title>
</head>
<body>
<div class="header">
header
</div>
<div class="nav">
<ul id="button">
<li><a href="">home</a></li>
<li><a href="">tips</a></li>
<li><a href="">tutorial</a></li>
<li><a href="">news</a></li>
<li><a href="">downloads</a></li>
</ul>
<div id="search">search : <input></input></div>
</div>
<div class="section">
<div id="article">
article
</div>
<div id="sidebar">
sidebar
</div>
section
</div>
<div class="footer">
footer
</div>
</body>
</html>
Tidak ada komentar:
Posting Komentar