Page 68 - Modul web baru

www.flipbuilder.com www.flipbuilder.com 63 www.flipbuilder.com

mempercantik tampilan, tabel tersebut dapat kita tambahkan CSS Contoh script css

sebagai berikut :
www.flipbuilder.com www.flipbuilder.com www.flipbuilder.com
h1{
font: 18px/24px Verdana, Arial, Helvetica, sans-serif;
}
table {
font: 11px/24px Verdana, Arial, Helvetica, sans-serif;
border-collapse: collapse;
width: 600px;
}
th {
padding: 0 0.5em;
text-align: left;
www.flipbuilder.com www.flipbuilder.com www.flipbuilder.com
border-top: 1px solid #FB7A31;
border-bottom: 1px solid #FB7A31;
background: #FFC;
}
td {
border-bottom: 1px solid #CCC;
padding: 0 0.5em;
}
td:first-child {
width: 10px;
www.flipbuilder.com www.flipbuilder.com www.flipbuilder.com
text-align:center
}

tr:hover{
background:#e5e5e5;
}
tr:nth-child(odd) {
background-color:#f5f5f5;
}
tr:nth-child(even) {
www.flipbuilder.com www.flipbuilder.com www.flipbuilder.com
background-color:#fff;
}
Jika Jalankan maka akan tampil seperti di bawah ini :

www.flipbuilder.com www.flipbuilder.com www.flipbuilder.com

Modul Pemrograman Web SMKN 2 Mojokerto

www.flipbuilder.com www.flipbuilder.com www.flipbuilder.com