ul hover li下的a标签

2024-10-17

css中的hover ，关于li与a标签的问题

<head> <style> ul li a:hover{ background-color: red; } </style></head><ul> <li><a>文字</a></li></ul> 这样只有文字悬停时会变红但是我要前面的小圆点也变红有没有办法?实际工作中背景是个图片把背景图片向左移也行就是要整个 li 都在背景中但hover只对a有效 ,如果在li外面包一个&

HTML中的ul, ol,li , dl,dt, dd标签

ul: unordered lists ol: ordered lists li: Lists ol 有序列表. <ol><li>……</li><li>……</li><li>……</li></ol> 表现为: 1……2……3…… ul 无序列表,表现为li前面是大圆点而不是123 <ul><li>……</li><li>……</li></ul>

清除li内a标签的float=left实现a标签在li内居中显示(ul内li不居中显示)

写在前面: 修改cnblogs主页面菜单显示问题. 问题描述:在给主菜单添加hover样式后发现菜单内容并未居中.见图1. 网上搜索到资料其中一篇讲的可以说简明扼要了,也是伸手党的福利(点我查看原文).懒得点的话代码也附到文章最后了= =. 但是! 凡事都有个但是! 关键是我伸手后并没达到预期效果, 仍然是不居中, 寻思是不是博主搞错了? F12调试才发现li下面的a标签仍然有一个float:left属性, 去掉之后能实现居中显示! 喜大普奔有木有!不说了, 见图2. 附转载文章代码: html

jquery选择div下的ul下的li下的a

使用jQuery选择器: $("div#div的id ul li a")//选择的是div下 ul下所有li下的所有a标签 $("div#div的id").children("ul:first").children("li:first").find("a");//div下的第一个ul下的第一个li下的a标签 //可以用下标 $("div#div的id").children("u

DIV+CSS中标签ul ol li dl dt dd用法

ul ol li dl dt dd都是DIV+CSS做网页长用的东西,相当于一棵树的树技,下面就了解一下这些东西的全体用法,本人用dd,dt,dd用得很少,懂得结合使用对做架构是很有好处的哦! DIV CSS网页布局中常用的列表元素ul ol li dl dt dd释义,块级元素div尽量少用,和table一样,嵌套越少越好 ol 有序列表.<ol><li>……</li><li>……</li><li>……</li><

ul、li实现横向导航按钮

好久没写博客了,主要是懒得呼气都不想呼,上周分给我一个新的任务,就是自己新建一个系统,快速极限开发,虽然之前自己也做过小的系统,但毕竟是自己做,随着自己的心意做,没有做其他的限制等,现在呢是给公司做,所以在质量上是绝对要比自己一个人做着玩要高.上周算是把框架搭起来来,今天上午熟悉下需求,下午的时候把数据库中关键的几个表设计了一下,明天就要往框架里面搬砖了,华为那边还说要两周搞定,word 哥啊,压力山大,不过这几天学的东西也挺多的,之前做的项目是用webform做的,框架也是传统的三层,现在的这

ul+jquery自定义下拉选择框

<!doctype html> <html> <head> <meta charset="UTF-8"> <title>ul+jquery实现下拉选择框</title> <script typet="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script

[HTML]去除li前面的小黑点,和ul、LI部分属性

[转] 对于很多人用div来做网站时,总会用到,但在显示效果时前面总是会有一个小黑点,这个令很多人头痛,但又找不到要源,其它我们可以用以下方法来清除.[HTML]去除li前面的小黑点,和ul.LI部分属性[转] 对于很多人用div来做网站时,总会用到,但在显示效果时前面总是会有一个小黑点,这个令很多人头痛,但又找不到要源,其它我们可以用以下方法来清除.1.在CSS中写入代码.找到相关性的CSS,在..li和.ul下写入list-sytle:none;当然有的会这样来写list-style-typ

li下用了浮动IE6的问题

li下用了浮动IE6的问题直接看HTML <ul> <li><a href="#" target="_blank">沃尔沃认为认为</a></li> <li><a href="#" target="_blank">沃尔沃认为认为</a></li> <li><a href="#" t

解决ul的li横向排列换行的问题

1. 问题现象先看下面的html结构: <div> <ul> <li><img src='./img/1.jpg'></li> <li><img src='./img/2.jpg'></li> <li><img src='./img/3.jpg'></li> <li><img src='./img/4.jpg'></li> </ul

如何去掉ul和li前面的小黑点

做网站的时候经常会遇到如上图所示的小圆点,难看不说,还容易影响布局,下面就介绍几种消除小圆点的方法: 1. 找到相关CSS文件,在.ul 和.li 部分添加: 1 list-style: none; 或: 1 list-style-type: none; 2. 在页面<head>部分添加: 1 <style type="text/css"> 2 list-style: none; 3 </style> 3. 在HTML标签中添加: 1 <ul

ul、li模仿ios的TableView实现城市选择

最近项目一个接着一个,之前说的精创环的项目还没做完,今天说先把那个放一下,先做访客系统,销售会见客户之后可以对客户进行一个跟踪记录,原型图也给了,今日头条的频道自定义页面一样. 如果是在IOS上让我来做我能很快搞定,但是让用web来做可是难着我了,由于上一博客也写了关于ul.li的导航的demo,我也知道这个也可以用ul.li来做,但是真自己动手做的时候完全不是那回事,搞了半天都没搞定,华为那边客户说让两天搞定,真是压力山大.今天晚上下班吃完饭就坐在电脑前来解决这个问题,功夫不负有心人,可算是解

CSS中的ul与li样式详解

CSS中的ul与li样式详解ul和li列表是使用CSS布局页面时常用的元素.在CSS中,有专门控制列表表现的属性,常用的有list-style-type属性.list-style-image属性.list-style-position属性和list-style属性. 一.list-style-type属性 list-style-type属性是用来定义li列表的项目符号的,即列表前面的修饰.list-style-type属性是一个可继承的属性.其语法结构如下:(列举一些常用的属性值) list-s

在IE6/7/8下识别html5标签

识别html5标签: html5添加了许多语义化的标签,比如<nav></nav>,<aside></aside>,<article></article>什么的,当时看到这些标签的时候心想html5估计很多老式IE浏览器都不支持,也没多大重视,今天早上在群里面看到这些标签的讨论,心里顿时冒出一个疑惑,我在chrome等现代浏览器下面用这些标签固然可以,那么我在IE6/7/8下用这些标签会有什么效果了呢.于是立马动手测试. <!d

div、ul、li等无法居中问题，text-align无效 margin auto无效

很简单.如果是div,直接把div换成: <table align="center"> <tr> <td> div里的内容 <td> <td> </table> ul与li也一样.把ul外面套一个这玩意就行,最终: <table align="center"> <tr> <td> <ul .... /> <

ul中li分列显示

让ul中li分列显示,用li显示两列如下(要显视多列的自己想办法,哈哈): 2列 <ul> <li style="display:block;float:left;width:50%"><a href="url">a</a> </li> <li style="display:block;float:left;width:50%"><a href="url&qu

CSS中的ul与li样式详解 list-type

转自新浪博客http://blog.sina.com.cn/u/2539885750 ul和li列表是使用CSS布局页面时常用的元素.在CSS中,有专门控制列表表现的属性,常用的有list-style-type属性.list-style-image属性.list-style-position属性和list-style属性. 一.list-style-type属性 list-style-type属性是用来定义li列表的项目符号的,即列表前面的修饰.list-style-type属性是一个可继承的属

关于table的td和ul元素li隔行变色的功能实现

table元素的td和ul元素li隔行变色的功能实现利用css控制二者的样式轻松实现隔行换色: 例如:table的css样式控制: table tr td{ background-color:颜色1 } table tr td:nth-child(2n+1){ background-color:颜色2 } ul的li样式控制 ul li{ background-color:颜色1: } ul li:nth-child(2n+1){ background-color:颜色2:

如何使ul中li元素横向排列且不换行

外层div容器宽度固定,ul宽度随li(li宽度固定)的增加而撑开,但是当ul中li的宽度之和大于div时,ul没有撑开,而是li换行了,如何使li不换行? 解决方法:主要是外面容器设置为white-space:nowrap:li设置为display:inline-block:而不是float:left: <!DOCTYPE html> <html> <head> <style> #pic_list { display:block; white-spac

JS动态增加删除UL节点LI

JS如何动态增加删除UL节点LI及相关内容. <ul id="ul"> <li id=1>11111111111111111<a href="javascript:del(1);">del</a></li> <li id=2 >22222222222222222<a href="javascript:del(2);">del</a></li>

JS动态增加删除UL节点LI及相关内容示例

<ul id="ul"> <li id=1>11111111111111111<a href="javascript:del(1);">del</a></li> <li id=2 >22222222222222222<a href="javascript:del(2);">del</a></li> <li id=3>333333

ul hover li下的a标签

热门专题