ul+li及css制作韩国风格菜单代码_好看的ul列表资源-CSDN文库

162 浏览量 2020-10-30 15:07:56 上传评论收藏 43KB PDF 举报

资源推荐

资源详情

资源评论

ul+li及及css制作韩国风格菜单代码制作韩国风格菜单代码

ul+li及css制作韩国风格菜单代码

<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>

<ul id="nav">

<li class="aa">CSS

Templates Free

Download </li>

<li class="bb">CSS

WebSites Showcase

</li>

<li class="cc">CSS Web

Design Article </li>

</ul>

运行代码

复制代码

保存代码

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

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

韩国风格的网站设计思路之所以受到大家的喜欢，因为其色彩变化丰富，韩国风格的网站有一个最明显的特点就是对于表

格或是标题栏常会加上横或竖的一条色带。我们平常是常过图象图片软件来制作这样的效果，图片体积大，下载较慢。我们完

全可以用CSS来做这样的风格，因为用CSS只是对样式定义，不需要应用图片，下载速度会大大加快。

首先我们定义了列表项，宽度外边距及内边距。再设置链接文字的样式。我们使用类aa、bb、cc来定义不同列表项的色

彩，在这三个类的定义中，我们定义了上边框为4px。也就是韩国风格中最常见的色带。

本内容试读结束，登录后可阅读更多

下载后可阅读完整内容，剩余0页未读，立即下载

内容反馈

weixin_38625098

粉丝: 6
资源: 905

最新资源

资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！点击此处反馈

feedback-tip