一、item list
1,列表符号
ul {
list-style-type: decimal;
}
li.special {
list-style-type: circle;
}
disc
circle
square
decimal
upper-alpha
lower-alpha
upper-roman
lower-roman
none
2,图片符号
ul {
list-style-image: url(icon1.jpg);
}
or
ul {
list-style-type: none;
}
li {
background: url(icon1.jpg) no-repeat;
padding-left: 25px;
}
二、no table menu
<div id="navigation">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">My Blog</a></li>
<li><a href="#">Friends</a></li>
<li><a href="#">Next Station</a></li>
<li><a href="#">Contact me</a></li>
</ul>
</div>
#navigation {
width: 200px;
}
#navigation ul {
list-style-type: none;
margin: 0px;
padding: 0px;
}
#navigation li {
border-bottom: 1px solid #ED9F9F;
}
#navigation li a {
display: block;
padding: 5px 5px 5px 0.5em;
text-decoration: none;
border-left: 12px solid #711515;
border-right: 1px solid #711515;
}
#navigation li a:link, #navigation li a:visited {
background-color: #c11136;
color: #FFFFFF;
}
#navigation li a:hover {
background-color: #990020;
color: #FFFF00;
}
三、横向和纵向菜单
#navigation li {
float: left;
}
四、Tab菜单
<ul id="tabnav">
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<div id="content">
</div>
li.current {
border-bottom: 1px solid #FFFFFF;
color: #000000;
background-color: #FFFFFF;
}
即当前访问的tab菜单弄成白色下边框和白色背景,这样就将下边带边框的content div的边框覆盖一部分,所以看起来就是tab菜单了
分享到:
相关推荐
3.3 文字实例二:制作页面的五彩标题 3.4 CSS段落文字 3.5 段落实例:百度搜索 第4章 用CSS设置图片效果 4.1 图片样式 4.2 图片的对齐 4.3 图文混排 4.4 图文实例:八仙过海 ....
本书系统地讲解了CSS层迭样式表的基础理论和实际运用技术,通过大量实例对CSS进行深入浅出的分析,主要包括CSS的基本语法和概念,设置文字、图片、背景、表格、表单和菜单等网页元素的方法,以及CSS滤镜的使用。...
精通CSS+DIV网页样式与布局 视频教材主要内容 迅雷下载地址: 目录 第1部分 CSS基础知识篇 第1章 CSS的初步体验 1.1 CSS的概念 1.1.1 标记的概念 1.1.2 传统HTML的缺点 1.1.3 CSS的引入 1.1.4...
3.3 文字实例二:制作页面的五彩标题 3.4 CSS段落文字 3.5 段落实例:百度搜索 第4章 用CSS设置图片效果 4.1 图片样式 4.2 图片的对齐 4.3 图文混排 4.4 图文实例:...
3.3 文字实例二:制作页面的五彩标题 3.4 CSS段落文字 3.5 段落实例:百度搜索 第4章 用CSS设置图片效果 4.1 图片样式 4.2 图片的对齐 4.3 图文混排 4.4 图文实例:八仙过海 ...
3.3 文字实例二:制作页面的五彩标题 3.4 CSS段落文字 3.5 段落实例:百度搜索 第4章 用CSS设置图片效果 4.1 图片样式 4.2 图片的对齐 4.3 图文混排 4.4 图文实例:八仙过海 ...
这组视频教程是配合《精通CSS+DIV网页样式与布局》图书制作的,每一课对应于图书中的每一章。目录如下: CSS基础知识与核心概念 CSS初探 - CSS基本知识 - 第1课 CSS基本语法与核心概念 - CSS基本知识 - 第2课 ...
第8章 用css制作实用的菜单 第9章 css滤镜的应用 第2部分 css+div美化和布局篇 第10章 理解css定位与div布局 第11章 css+div布局方法剖析 第12章 css+div美化与布局实战 第3部分 css混合应用技术篇 第13章 css与...
3.3 文字实例二:制作页面的五彩标题 3.4 CSS段落文字 3.5 段落实例:百度搜索 第4章 用CSS设置图片效果 4.1 图片样式 4.2 图片的对齐 4.3 图文混排 4.4 图文实例:八仙过海 ....
本书系统地讲解了CSS层迭样式表的基础理论和实际运用技术,通过大量实例对CSS进行深入浅出的分析,主要包括CSS的基本语法和概念,设置文字、图片、背景、表格、表单和菜单等网页元素的方法,以及CSS滤镜的使用。...
系统地讲解了CSS层叠样式表的基础理论和实际运用技术,通过大量实例对CSS进行深入浅出的分析,主要包括CSS的基本语法和概念,设置文字、图片、背景、表格、表单和菜单等网页元素的方法,以及CSS滤镜的使用。...
系统地讲解了CSS层叠样式表的基础理论和实际运用技术,通过大量实例对CSS进行深入浅出的分析,主要包括CSS的基本语法和概念,设置文字、图片、背景、表格、表单和菜单等网页元素的方法,以及CSS滤镜的使用。...
系统地讲解了CSS层叠样式表的基础理论和实际运用技术,通过大量实例对CSS进行深入浅出的分析,主要包括CSS的基本语法和概念,设置文字、图片、背景、表格、表单和菜单等网页元素的方法,以及CSS滤镜的使用。...
3.3 文字实例二:制作页面的五彩标题 3.4 CSS段落文字 3.5 段落实例:百度搜索 第4章 用CSS设置图片效果 4.1 图片样式 4.2 图片的对齐 4.3 图文混排 4.4 图文实例:八仙过海 ...
重点介绍如何使用DlV+CSS3进行网页布局,注重实战操作,使读者在学习CSS3技术的同时,掌握DIV+CSS3的精髓。还介绍了一些扩展知识,包括CSS3与JavaScript、XML等综台应用。最后给出5个综合实例,使读者进一步巩固所学...
3.8 CSS制作实用菜单 3.8.1 项目列表 3.8.2 无需表格的菜单 第4章 ccCSS进阶 4.1 标记与标记 4.1.1 概述 4.1.2 与的区别 4.2 盒子模型 4.3 元素的定位 4.3.1 float定位 4.3.2 ...
数据库使用MS Access 2000以上 2.本书所附光盘实例代码: 第1章(\第1章) 查看1.2.htm中noscript显示效果的方法如下: 1.将该实例复制到C:\Inetpub\wwwroot下; 2.选择浏览器的“工具”-“安全”-“本地...