css中的列表样式
在网页设计中,我们经常将某些具有相似功能的标签放在同一组中,这时我们经常会用到列表标签(无序列表ul,有序列表ol),在列表标签中对列表样式的设计可以使我们的页面得到一定程度的美化。
在css中对列表样式主要是对列表项目前列表符号的设置,其语法如下:
list-style-type : disc | circle | square | decimal |
lower-roman | upper-roman | lower-alpha | upper-alpha |
none | armenian | cjk-ideographic | georgian | lower-greek |
hebrew | hiragana | hiragana-iroha | katakana | katakana-iroha |
lower-latin | upper-latin
通过取不同的list-style-type属性值,我们可以得到不同的项目符号。
例:
ul { list-style-type:disc;} /*实心圆*/ ul { list-style-type:circle;} /*空心圆*/ ul { list-style-type:square;} /*实心方块*/ ul { list-style-type:none;} /*不显示项目符号*/ ol { list-style-type:decimal;} /*阿拉伯数字*/ ol { list-style-type:lower-roman;} /*小写罗马数字*/ ol { list-style-type:upper-alpha;} /*大写英文字母*/
如果对于css中所规定了的众多列表符号感到不满意,我们呀可以自定义列表的符号
list-style-image : none | url ( url )
使用这种方式,我们可以为项目列表设置任意的图片为列表符号。这里,我们所设的值为图片文件相对于网页文件的路径或绝对路径(来自网站的文件)。
在列表样式中最为需要注意的是,列表样式只能在列表标签中设置(ul,ol),而不能设置在列表的自标签中(li)。
css中的列表样式的更多相关文章
- CSS Ul(列表样式)
CSS Ul(列表样式) CSS列表属性作用如下: 设置不同的列表项标记为有序列表 设置不同的列表项标记为无序列表 设置列表项标记为图像 一.列表 在HTML中,有两种类型的列表: 无序列表 - 列表 ...
- css3系列-2.css中常见的样式属性和值
css3系列-2.css中常见的样式属性和值 继续上一篇文章的继续了解css的基础知识,关注我微信公众号:全栈学习笔记 css中常见的样式属性和值 字体与颜色 背景属性 文本属性 边框属性 内外边距 ...
- css中的字体样式及元素样式
css中的字体样式一般包含有就9中,常见的有7种.这7种依次为: 1.字体样式:font-family: 2.字体大小:font-size: 3.字体加粗:font-weight: 4.字体斜体:fo ...
- 【经验】在CSS中定义超链接样式a:link、a:visited、a:hover、a:active的顺序
以前用CSS一直没有遇到过这个问题,在最近给一个本科同学做的项目里面.出现一些问题,搜索引擎查了一些网站和资料,发现很多人问到这个问题,给出的结果我试了试,大部分都不正确. 给出我试的顺序,可能会对大 ...
- css中的列表属性
list-style-type设定引导列表的符号类型,可以设置多种符号类型,值为disc.circle.square等 list-style-image使用图像作为定制列表的符号 list-style ...
- css中的段落样式及背景
一.段落样式 css中关于段落的样式主要有行高,缩进,段落对齐,文字间距,文字溢出,段落换行等.它们的具体语法如下: line-height : normal | length text-indent ...
- CSS如何设置列表样式属性
列表样式属性 在HTML中有2种列表.无序列表和有序列表,在工作中无序列表比较常用,无序列表就是ul标签和li标签组合成的称之为无序列表,那什么是有序列表呢?就是ol标签和li标签组合成的称之为有序列 ...
- CSS如何设置列表样式属性,看这篇文章就够用了
列表样式属性 在HTML中有2种列表.无序列表和有序列表,在工作中无序列表比较常用,无序列表就是ul标签和li标签组合成的称之为无序列表,那什么是有序列表呢?就是ol标签和li标签组合成的称之为有序列 ...
- css冲突2 要关闭的css在项目代码以外,但是是通过<link>标签引入的css(例如bootstrap):解决方法,在APP.css中使用全局样式
css冲突,导致html字体过小. 通过浏览器检查发现,导致字体过小的css来自bootstrap. 现要关闭bootstrap的css: 直接在APP.css中添加: html{ font-size ...
随机推荐
- Android 之 资源文件的介绍及使用
Android 之 资源文件的介绍及使用 1.资源的简单介绍: 在res文件夹中定义:字符串.颜色.数组.菜单.图片.视频等:在应用程序中使用这些资源. 2.使用资源的长处:降低代码量,同一时候为 ...
- Mac下Qt连接MySQL 驱动问题
Mac OS X下Qt的mySQL driver编译安装 原创文章,采用CC协议发布,转载请注明: 转载自canX.me 本文链接地址: Mac OS X下Qt的mySQL driver编译安装 – ...
- HttpClient get返回String类型 JAVA
public static String httpGet(String url) { // get请求返回结果 String strResult = ""; try { Defau ...
- 图形混合模式 PorterDuff Xfermodes
16种图形混合模式示例 首先绘制Dst(黄色的),然后绘制Src(蓝色的) 问题来了:为何还会有部分黄色?不应该是把src和dst都清除了吗? 图形混合模式简介 ProterDuff的含义 Prote ...
- MySQL 远程访问开启
打开mysql客户端,直接运行以下命令:1.use mysql; 2.update user set host='%' where user='root'; 会报错:ERROR 1062 (23000 ...
- java日期操作
//字符串转日期 public static void dt7() throws ParseException { String str_date="2015---08---08" ...
- sql server 数据库附加时程序集错误
在数据库detach和attach的过程中,如果在建立程序集的时候选择的权限集是无限制,并且在建立程序集的时候和后来attach的时候 采用的不是同一个用户,就可能造成部分功能无法使用.原因是由于在选 ...
- web标准(复习)--7 横向导航菜单
今天我们开始学习html列表,包含以下内容和知识点: 横向列表菜单 用图片美化的横向导航 css Sprites 一.横向列表菜单前边学习过纵向导航菜单,又学习了float属性,那么要实现横向导航菜单 ...
- jquery1.9学习笔记 之选择器(基本元素四)
ID选择器("#id") 描述: 选择与给出ID属性匹配的单元标签. 对于ID选择器,jquery使用JS的函数document.getElementById(),当一个标签附加到 ...
- ac automaton 专题
hdu2222 模板题 hdu2825 在ac自动机上的状压dp hdu3247 在ac自动机上bfs poj2778 求长度为n,不包含给定的m个字符串的任何一个的字符串的个数 其实就是求长度为n的 ...