ul+li及css制作韩国风格菜单代码_经验交流

来源：懂视网责编：小采时间：2020-11-27 18:55:12

ul+li及css制作韩国风格菜单代码_经验交流

ul+li及css制作韩国风格菜单代码_经验交流:ul+li及css制作韩国风格菜单代码_经验交流<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xml

推荐度：

点击下载本文 文档为doc格式

导读ul+li及css制作韩国风格菜单代码_经验交流:ul+li及css制作韩国风格菜单代码_经验交流<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xml

ul+li及css制作韩国风格菜单代码_经验交流

<!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.gxlcms.com</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>

韩国网站的设计风格特征鲜明，色彩明快，现在越来越多的人正在模仿这种风格。

韩国风格的网站设计思路之所以受到大家的喜欢，因为其色彩变化丰富，韩国风格的网站有一个最明显的特点就是对于表格或是标题栏常会加上横或竖的一条色带。我们平常是常过图象图片软件来制作这样的效果，图片体积大，下载较慢。我们完全可以用CSS来做这样的风格，因为用CSS只是对样式定义，不需要应用图片，下载速度会大大加快。

首先我们定义了列表项，宽度外边距及内边距。再设置链接文字的样式。我们使用类aa、bb、cc来定义不同列表项的色彩，在这三个类的定义中，我们定义了上边框为4px。也就是韩国风格中最常见的色带。

ul+li及css制作韩国风格菜单代码_经验交流

推荐度：

点击下载本文 文档为doc格式

标签：设计风格代码代码菜单代码

热门焦点

ul+li及css制作韩国风格菜单代码_经验交流

ul+li及css制作韩国风格菜单代码_经验交流

ul+li及css制作韩国风格菜单代码_经验交流

最新推荐

猜你喜欢

热门推荐