Rumah > Artikel > hujung hadapan web > ul+li dan css untuk mencipta kod menu gaya Korea_Pertukaran pengalaman
ul+li dan css untuk mencipta kod menu gaya Korea_Pertukaran pengalaman
- PHP中文网asal
- 2016-05-16 12:06:501908semak imbas
Ul+li dan css untuk mencipta kod menu gaya Korea_Pertukaran pengalaman
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>www.jb51.net</title>
<style type="text/css">
<!--
* {font-size:13px;font-family:Arial;}
#nav li {list-style:none; width:200px; margin-top:5px;padding:4px 6px;}
#nav li a {text-decoration:none; color:#666;}
#nav li a:hover {color:#000;}
.aa {border-top:4px solid #7BC110; background:#be6;}
.bb {border-top:4px solid #ff9900; background:#fc3;}
.cc {border-top:4px solid #ff66ff; background:#fcf;}
-->
</style>
</head>
<body>
<ul id="nav">
<li class="aa"><a href="/">CSS Templates Free Download </a></li>
<li class="bb"><a href="/">CSS WebSites Showcase </a></li>
<li class="cc"><a href="/">CSS Web Design Article </a></li>
</ul>
</body>
</html>
Gaya reka bentuk laman web Korea adalah tersendiri dan berwarna-warni, dan kini terdapat lebih banyak lagi lebih ramai yang meniru gaya ini. | reben tajuk. Kami biasanya menggunakan perisian imej untuk mencipta kesan sedemikian, tetapi saiz imej adalah besar dan muat turun adalah perlahan. Kami boleh menggunakan CSS sepenuhnya untuk mencipta gaya sedemikian, kerana menggunakan CSS hanya mentakrifkan gaya tanpa menggunakan imej, dan kelajuan muat turun akan dipercepatkan.
Mula-mula kita tentukan item senarai, lebar, jidar dan padding. Kemudian tetapkan gaya teks pautan. Kami menggunakan kelas aa, bb dan cc untuk mentakrifkan warna item senarai yang berbeza Dalam definisi ketiga-tiga kelas ini, kami mentakrifkan sempadan atas menjadi 4px. Iaitu, reben yang paling biasa dalam gaya Korea.
Di atas adalah kandungan ul+li dan css untuk membuat pertukaran kod_pengalaman menu gaya Korea Untuk kandungan yang lebih berkaitan, sila perhatikan laman web PHP Cina (www.php.cn)!