[HTML]去除li前面的小黑点,和ul、LI部分属性[转]
转摘自:http://blog.csdn.net/cqkxzyi/article/details/7606181
对于很多人用div来做网站时,总会用到,但在显示效果时前面总是会有一个小黑点,这个令很多人头痛,但又找不到要源,其它我们可以用以下方法来清除。
1、在CSS中写入代码。找到相关性的CSS,在。.li和.ul下写入list-sytle:none;当然有的会这样来写list-style-type:none, 这种写法特别是在一些CMS中最常见。
2、在相关的页面找到head部分写入下面的代码
<style type="text/css">
list-style:none;
</style>
3、在li,ul内加入list-style。如<ul style="list-style-type:none><li><a herf="http://blog.163.com/ldy_3881685">我的博客</a></li>< /ul> 当然这种是很麻烦的了。
最简单的就是第一种了,通过CSS来控制,这个当然会有不错的效果了。
这几种方法都是通过设置list-style:none来设置的,有的是会用list-style-type,下面我们来看一看它的属性.
none不使用项目符号
disc实心圆,默认值
circle空心圆
square实心方块
decimal阿拉伯数字
lower-roman小写罗马数字
upper-roman大写罗马数字
lower-alpha小写英文字母
upper-alpha大写英文字母
这些都可以来代替上文中的none,想要什么样的都会有一个相应的对应。
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;
}
<ul><li>的区别<LI> 的参数设定(常用):
例如: <li type="square" value="4">
type="square"
只适用于非顺序清单,设定符号款式,其值有三种,如下,内定为 type="disc":
符号 是当 type="disc" 时的列项符号。
符号 if" width=10 height=10 border=0> 是当 type="circle" 时的列项符号。
符号 是当 type="square" 时的列项符号。
value="4"
只适用于顺序清单,设定该一项的数目,其後各项将以此作为起始数目而递增,但前面各项则不受影响,其值只能是 1,2,3.. 等整数,没有内定值。
<UL>称为无序清单标记。
所谓无序清单就是在每一项前面加上、、等符号,故又称符号清单。
<UL> 的参数设定(常用):
例如: <UL type="square">
type="square"
设定符号款式,其值有三种,如下,内定为 type="disc":
符号 是当 type="disc" 时的列项符号。
符号 是当 type="circle" 时的列项符号。
符号 是当 type="square" 时的列项符号。
<ul>是项目列表,<li>是列表项,项目列表就是用符号来列的,所以你列出来默认的就是黑点啦,还有一个是<ol>这个是编号列表,用数字来列的,也是用<li>做列表项
<li>是 list item 即列表项,但列表有很两种,所以外面得有 <ul> 或者 <ol> 用来区别无序列表(小点点)和有序列表(1,2,3...)。
[HTML]去除li前面的小黑点,和ul、LI部分属性[转]的更多相关文章
- [HTML]去除li前面的小黑点,和ul、LI部分属性
[转] 对于很多人用div来做网站时,总会用到,但在显示效果时前面总是会有一个小黑点,这个令很多人头痛,但又找不到要源,其它我们可以用以下方法来清除.[HTML]去除li前面的小黑点,和ul.LI部分 ...
- 如何在Html的CSS中去除<li>标签前面小黑点,和ul、LI部分属性方法
div是很多人做网站都会用到的,但在显示效果时前面总是会有一个小黑点,这个效果很多人不想要,但又不知到如何去除,然而我们可以用以下方法来清除. 1.在CSS中写入代码.找到相关性的CSS,在..li和 ...
- 如何在Html的div+css中去除<li>标签前面小黑点,和ul、LI部分属性方法
div是很多人做网站都会用到的,但在显示效果时前面总是会有一个小黑点,这个效果很多人不想要,但又不知到如何去除,然而我们可以用以下方法来清除. 1.在CSS中写入代码.找到相关性的CSS,在..li和 ...
- Html中CSS之去除li前面的小黑点,和ul、LI部分属性方法
对于很多人用div来做网站时,总会用到,但在显示效果时前面总是会有一个小黑点,这个令很多人头痛,但又找不到要源,其它我们可以用以下方法来清除.1.在CSS中写入代码.找到相关性的CSS,在..li和. ...
- 如何去掉ul和li前面的小黑点
做网站的时候经常会遇到如上图所示的小圆点,难看不说,还容易影响布局,下面就介绍几种消除小圆点的方法: 1. 找到相关CSS文件,在.ul 和.li 部分添加: 1 list-style: none; ...
- 图形剖析,当给 ul 设置padding=0, margin=0后 li前面的小黑点消失的现象原理!
- html ul li的学习
DIV+CSS里,我们用得最多的就是ul li来显示数据,如新闻按钮等. <div id="menu"> <ul> <li><a href ...
- css控制UL LI 的样式详解
用<ul>设置导航 <style> #menu ul {list-style:none;margin:0px;} #menu ul li {float:left;} </ ...
- css控制UL LI 的样式详解(推荐)
代码如下: <div id="menu"> <ul> <li><a href="#">首页</a>& ...
随机推荐
- python2.7练习小例子(十五)
15):题目:输出指定格式的日期. 程序分析:使用 datetime 模块. 程序源代码: #!/usr/bin/python # -*- coding: UTF-8 -*- ...
- 笔记-flask-原理及请求处理流程
笔记-flask-原理及请求处理流程 1. 服务器声明及运行 最基本的flask项目代码如下 from flask import Flask app = Flask(__name__) @a ...
- HBase 是什么
Apache HBase™ is the Hadoop database, a distributed, scalable, big data store. HBase 是 Hadoop databa ...
- 在WPF中自定义控件(1)
原文:在WPF中自定义控件(1) 在WPF中自定义控件(1):概述 周银辉一, 不一定需要自定 ...
- [Hbase]hbase命令行基本操作
-进入hbase shell hbase shell - 帮助help help - 查看hbase versionversion - 查看hbase 状态 status - 创建表create 't ...
- 1139: [POI2009]Wie
1139: [POI2009]Wie https://www.lydsy.com/JudgeOnline/problem.php?id=1139 分析: Dijkstra.状压最短路,dis[i][j ...
- 1321. [ZJOI2012] 灾难
1321. [ZJOI2012] 灾难 ★★☆ 输入文件:catas.in 输出文件:catas.out 简单对比时间限制:1 s 内存限制:128 MB [问题描述] 阿米巴是小强的 ...
- P2419 [USACO08JAN]牛大赛Cow Contest
P2419 [USACO08JAN]牛大赛Cow Contest 题目背景 [Usaco2008 Jan] 题目描述 N (1 ≤ N ≤ 100) cows, conveniently number ...
- vs13发布web程序 iis上
一.配置iis 1,找到控制面板--程序--启用或关闭Windows功能 2,从列表中选择Internet Infomation Services,并且把相应的功能条目勾选上,如果不清楚,可以全部选中 ...
- Qt 个性化标题栏,自定义标题栏
目前还没有达到自己满意的地步,魔方别人写的的,先提供参考,后面在加入新的东西 头文件 #ifndef TITLEBAR_H #define TITLEBAR_H #include <QWidge ...