CSS(9)——菜单和ul

本文详细介绍了网页中列表项标识的CSS属性,包括无序与有序列表样式,以及如何使用list-style简写。同时,阐述了如何利用border-bottom与border-right创建分割线,并通过a:hover与a:visited实现菜单的hover与点击效果。此外,还讲解了如何将垂直列表转换为水平显示,以及制作tab菜单的方法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

UL和LI

1.  列表项前的标识,用 CSS 的 list-style-type 这两种列表的标识都可以有四种选择:

      无序: disc, circle, square, decimal

      有序: upper-roman, lower-roman, upper-alpha, lower-alpha.

2.  列表前图片: list-style-image

3.  可以使用 list-style 简写

 

制作菜单

1. 分割线实用 border-bottom| border-right实现

2. 菜单的hover的点击效果,使用a:hover设置背景色,a:visit设置字体粗细实现

3. 横竖转换:默认情况下list是竖形显示的,而如果要使其横向显示,对ul使用float:left进行控制。 如果使用float:left布局,其效果类似于Layout

4. tab菜单效果: 设置ul的border 使tab有整体感。 设置每个li中的a的broder,当点击时修改li的border-bottom为白色或背景色

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值