参考网址:http://hi.baidu.com/july_leo/item/5237cd612070ae2668105b40

如何修改ul li的显示

--------------------------------

css对应的定义:

ul{ margin-left: 15px;margin-bottom: 0px; } li{ list-style-type:disc; }

----------------

参考资料:

list-style-type的常用用法

语法: list-style-type : disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none

取值: disc : CSS1 默认值。实心圆 circle : CSS1 空心圆 square : CSS1 实心方块 decimal : CSS1 阿拉伯数字 lower-roman : CSS1 小写罗马数字 upper-roman : CSS1 大写罗马数字 lower-alpha : CSS1 小写英文字母 upper-alpha : CSS1 大写英文字母 none : CSS1 不使用项目符号

-------------------

LI代码的格式化:

A).运用CSS格式化列表符:

ul li{ list-style-type:none; }

B).如果你想将列表符换成图像,则:

ul li{ list-style-type:none; list-style-image: url(images/icon.gif); }

C).为了左对齐,可以用如下代码:

ul{ list-style-type:none; margin:0px; }

D).如果想给列表加背景色,可以用如下代码:

ul{ list-style-type: none; margin:0px; } ul li{ background:#CCC; }

E).如果想给列表加MOUSEOVER背景变色效果,可以用如下代码:

ul{ list-style-type: none; margin:0px; } ul li a{ display:block; width: 100%; background:#ccc; } ul li a:hover{ background:#999; }

说明:display:block;这一行必须要加的,这样才能块状显示!

F).LI中的元素水平排列,关键FLOAT:LEFT:

ul{ list-style-type:none; width:100%; } ul li{ width:80px; float:left; }

关于css中使用ul li的一些体会的更多相关文章

  1. CSS中的ul与li样式详解

    CSS中的ul与li样式详解ul和li列表是使用CSS布局页面时常用的元素.在CSS中,有专门控制列表表现的属性,常用的有list-style-type属性.list-style-image属性.li ...

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

    转自新浪博客http://blog.sina.com.cn/u/2539885750 ul和li列表是使用CSS布局页面时常用的元素.在CSS中,有专门控制列表表现的属性,常用的有list-style ...

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

    ul ol li dl dt dd都是DIV+CSS做网页长用的东西,相当于一棵树的树技,下面就了解一下这些东西的全体用法,本人用dd,dt,dd用得很少,懂得结合使用对做架构是很有好处的哦! DIV ...

  4. CSS中如何将li横向排列

    直接贴段例子代码吧: @{ Layout = null;} <!DOCTYPE html><style type="text/css"> .test li ...

  5. css中实现ul两端的li对齐外面边缘

    其实就是设置ul的宽度大一些就好

  6. jquery中对于ul>li列表分页。学习记录

    这个是很简单的一种分页,只能对列表进行分页.为了开发有可能需要用到记录下来 Html代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 T ...

  7. html中去除ul,li标签的样式列表标签的点?

  8. css控制UL LI 的样式详解

    用<ul>设置导航 <style> #menu ul {list-style:none;margin:0px;} #menu ul li {float:left;} </ ...

  9. css控制UL LI 的样式详解(推荐)

    代码如下: <div id="menu"> <ul> <li><a href="#">首页</a>& ...

随机推荐

  1. 初学swift笔记 结构体(八)

    import Foundation /* 和类很相似 结构体 -> 封装 属性.方法 结构体是值类型 */ //定义一个LSQ类型的结构体 关键字struct struct LSQ { var ...

  2. 今日哈工大刷推荐python脚本

    import httplib import random import time import urllib2 import re address = raw_input("Please i ...

  3. Razor学习(二)@Html标签

    原文链接:http://blog.csdn.net/pasic/article/details/7093802 只是因为原文作者说的东西,还有很多作为基础知识的东西,我都没有掌握,所以总结在这里,蓝字 ...

  4. WPF 接收exe传的值

    原文:WPF 接收exe传的值 一,首先重载APP protected override void OnStartup(StartupEventArgs e)         {            ...

  5. poj 2516 (费用流)

    题意:有N个供应商,M个店主,K种物品.每个供应商对每种物品的的供应量已知,每个店主对每种物品的需求量的已知,从不同的供应商运送不同的货物到不同的店主手上需要不同的花费,又已知从供应商m送第k种货物的 ...

  6. OAuth2.0认证介绍

    OAuth2.0鉴权 返回 目录 [隐藏] 1 腾讯微博OAuth2.0认证介绍 2 获取accesstoken的两种方式 2.1 1.Authorization code grant 2.1.1 第 ...

  7. 依赖注入及AOP简述(十)——Web开发中常用Scope简介 .

    1.2.    Web开发中常用Scope简介 这里主要介绍基于Servlet的Web开发中常用的Scope. l        第一个比较常用的就是Application级Scope,通常我们会将一 ...

  8. 手机端页面自适应:rem布局

    rem布局非常简单,首页你只需在页面引入这段原生js代码就可以了 (function (doc, win) { var docEl = doc.documentElement, resizeEvt = ...

  9. JeeSite 企业信息化快速开发平台

    平台简介 JeeSite是基于多个优秀的开源项目,高度整合封装而成的高效,高性能,强安全性的开源Java EE快速开发平台. JeeSite本身是以Spring Framework为核心容器,Spri ...

  10. 超级实用且不花哨的js代码大全

    事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event.srcEl ...