关于ul li的小问题

  很多时候我们都会遇到这种情况,那就是一个ul里面包含一个或多个ul。这个时候,如果在css中只想选择某个子ul中的li或是只想选择父ul中的li,那就不能仅仅用"ul li"选择。这个时候应该给每个ul添加class或是id名,然后通过class或id名来选择。

 1 <ul id="menu">
 2         <li>111</li>
 3         <li>111
 4                 <ul>
 5                         <li>222</li>
 6
 7                 </ul>
 8
 9         </li>
10         <li>111</li>
11         <li>111</li>
12 </ul>

  如果想选择111,那么可以用#menu > li进行选择。如果想选择222,那么可以用#menu li ul li选择。

时间: 2024-10-29 19:08:51

关于ul li的小问题的相关文章

html基础 无序列表ul li 项目符号的类型 type 小黑点disc 空心圆circle 实心方块sqaure

镇场诗: 清心感悟智慧语,不着世间名与利.学水处下纳百川,舍尽贡高我慢意. 学有小成返哺根,愿铸一良心博客.诚心于此写经验,愿见文者得启发.------------------------------------------ code: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=ut

[转载] ul li css 做横向菜单

原文地址: http://www.cnblogs.com/amylis_chen/archive/2011/09/24/2188398.html 第一步:建立一个无序列表 我们先建立一个无序列表,来建立菜单的结构.代码是: <ul> <li><a href="1">首页</a></li> <li><a href="2">产品介绍</a></li> <li

css基础 使用div块清除无序列表ul,li中的左右浮动的简单示例 clear:both

镇场诗: 清心感悟智慧语,不着世间名与利.学水处下纳百川,舍尽贡高我慢意. 学有小成返哺根,愿铸一良心博客.诚心于此写经验,愿见文者得启发.------------------------------------------ code: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"

ul li 好友列表

<div class="col-md-4 mt"> <div class="friend-list"> <h4 class="title" id="fri-title"><i class="fa fa-angle-down" id="i-icon"></i>选择收件人</h4> <ul class="

ul li CSS 样式(转)

ul li CSS 样式_无情无绪_新浪博客 http://blog.sina.com.cn/s/blog_61352f210100eqeq.html 列表是HTML里一种很有用的显示方式,可以把相关的并列内容整齐地垂直排列,使网页显得整洁专业,并让浏览者有一目了然的感觉.样式表为列表增加了一些功能,控制列表的样式包括列表样式.图形符号.列表位置三个部分.1.列表符号列表符号是指显示于每一个列表项目前的符号标识.基本格式如下:list-style-type:参数参数取值范围:·disc:圆形·c

div+css(ul li)实现图片上文字下列表布局

css样式表代码: html布局代码: 效果图: html布局部分,可根据自己需要添加对应的div即可. 1.CSS关键样式单词解释 1).ul.imglist{ margin:0 auto; width:536px; overflow:hidden}使用margin:0 auto,让ul结构布局居中:使用overflow:hidden,因为ul的子级使用float属性会产生浮动,所以使用清除子级使用float对父级产生不能撑开问题:使用宽度width:536px;固定宽度让子级li准确一排只排

html ul li 显示数据库

方法1: function insert() { var str=""; var data="你的数据库数据"; str="<ul><li>"+data+"</ul></li>"; document.getElementById("test").innerHTML = str; } <body onload="insert()">

&lt;ul&gt;-&lt;li&gt;无序列表标签

概念:多个并列的列表项之间没有先后顺序 源码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http

用ul li做的menu怎么才能使整个li都是链接区域?

a 加上 display:block <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-e