CSS 笔记——列表表格
6. 列表表格
-> 列表
(1)list-style
基本语法
list-style : list-style-image || list-style-position || list-style-type
语法取值
该属性是复合属性。请参阅各参数对应的属性。
默认值为:disc outside none。
使用说明
设置列表项目相关样式。当 list-style-image 和 list-style-type 都被指定了时, list-style-image 将获得优先权。除非 list-style-image 设置为 none 或指定 url 地址的图片不能被显示。
(2)list-style-image
基本语法
list-style-image : none | url ( url )
语法取值
none : 默认值。不指定图像
url ( url ) : 使用绝对或相对 url 地址指定图像
使用说明
设置或检索作为对象的列表项标记的图像。若此属性值为 none 或指定 url 地址的图片不能被显示时, list-style-type 属性将发生作用。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(3)list-style-position
基本语法
list-style-position : outside | inside
语法取值
outside : 默认值。列表项目标记放置在文本以外,且环绕文本不根据标记对齐
inside : 列表项目标记放置在文本以内,且环绕文本根据标记对齐
使用说明
设置或检索作为对象的列表项标记如何根据文本排列。假如一个列表项目的左外边距( margin-left )被设置为 0 ,则列表项目标记不会被显示。左外边距( margin-left )最小可以被设置为 30 。仅作用于具有 display 属性值等于 list-item 的对象。如 li 对象。注意: ol 对象和 ul 对象的 type 属性为其后的所有列表项目(如 li 对象)指明列表属性。此属性对于 currentStyle 对象而言是只读的。
(4)list-style-type
基本语法
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
语法取值
disc : CSS1 默认值。实心圆
circle : CSS1 空心圆
square : CSS1 实心方块
decimal : CSS1 阿拉伯数字
lower-roman : CSS1 小写罗马数字
upper-roman : CSS1 大写罗马数字
lower-alpha : CSS1 小写英文字母
upper-alpha : CSS1 大写英文字母
none : CSS1 不使用项目符号
armenianl : CSS2 未支持。传统的亚美尼亚数字
cjk-ideographic : CSS2 未支持。浅白的表意数字
georgian : CSS2 未支持。传统的乔治数字
lower-greek : CSS2 未支持。基本的希腊小写字母
hebrew : CSS2 未支持。传统的希伯莱数字
hiragana : CSS2 未支持。日文平假名字符
hiragana-iroha : CSS2 未支持。日文平假名序号
katakana : CSS2 未支持。日文片假名字符
katakana-iroha : CSS2 未支持。日文片假名序号
lower-latin : CSS2 未支持。小写拉丁字母
upper-latin : CSS2 未支持。大写拉丁字母
使用说明
设置或检索对象的列表项所使用的预设标记。若 list-style-image 属性值为 none 或指定 url 地址的图片不能被显示时,此属性将发生作用。假如一个列表项目的左外补丁( margin-left )被设置为 0 ,则列表项目标记不会被显示。左外补丁( margin-left )最小可以被设置为 30 。仅作用于具有 display 属性值等于 list-item 的对象。如 li 对象。
注意: ol 对象和 ul 对象的 type 属性为其后的所有列表项目(如 li 对象)指明列表属性。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(5)marker-offset
基本语法
marker-offset : auto | length
语法取值
auto : 默认值。浏览器自动设置间距
length : 由浮点数字和单位标识符组成的长度值。可为负值。请参阅 长度单位
使用说明
设置或检索标记容器和主容器之间水平补白。即两个容器靠近的一边的间距。作用于 display 属性值为 marker 的元素。
-> 表格
(1)border-collapse
基本语法
border-collapse : separate | collapse
语法取值
separate : 默认值。边框独立(标准HTML)
collapse : 相邻边被合并
使用说明
设置或检索表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(2)border-spacing
基本语法
border-spacing : length
语法取值
length : 由浮点数字和单位标识符组成的长度值。不可为负值。
使用说明
设置或检索当表格边框独立(例如当 border-collapse 属性等于 separate 时),行和单元格的边在横向和纵向上的间距。当只指定一个
length 值时,这个值将作用于横向和纵向上的间距。当指定了两个 length 值时,第一个作用于横向间距,第二个作用于纵向间距。
(3)caption-side
基本语法
caption-side : top | right | bottom | left
语法取值
top : 默认值。 caption 在表格的上边
right : caption 在表格的右边
bottom : caption 在表格的下边
left : caption 在表格的左边
使用说明
设置或检索表格( table )的 caption 对象是在表格的那一边。它是和 caption 对象一起使用的属性。
(4)empty-cells
基本语法
empty-cells : show | hide
语法取值
show : 默认值。显示边框
hide : 隐藏边框
使用说明
设置或检索表格( table )的 caption 对象是在表格的那一边。它是和 caption 对象一起使用的属性。
CSS 笔记——列表表格的更多相关文章
- HTML+CSS笔记 表格,超链接,图片,表单
表格 给表格加入CSS样式,添加表格边框 语法: <style type="text/css"> table tr td,th{border:1px solid #00 ...
- 学习笔记 第八章 使用CSS美化列表
第8章 使用CSS美化列表 8.1 列表的基本结构 在HTML中,列表结构可以分为两种基本类型:有序列表和无序列表.使用标签如下: <ul>...</ul>:标识无序列表: ...
- Bootstrap框架(基础篇)之列表,表格,表单
继续上篇的基础部分延伸,主要说一下列表,表格,表单相关Bootstrap框架变化以及基础知识. 1.列表篇 除了HTML提供的三种基本列表样式: 无序列表 <ul> <li>… ...
- 一个带标号的CSS文章列表写法
<title>CSS文章列表</title> <style type="text/css"> *{margin:0;padding:0;list ...
- HTML+CSS笔记 CSS笔记集合
HTML+CSS笔记 表格,超链接,图片,表单 涉及内容:表格,超链接,图片,表单 HTML+CSS笔记 CSS入门 涉及内容:简介,优势,语法说明,代码注释,CSS样式位置,不同样式优先级,选择器, ...
- 常用的CSS属性列表汇总
常用的CSS属性列表汇总 近期教学给学员总结常用的CSS属性,方便学习查询,正好发上来也给大家分享一下. 表格最右列的数字标识支持的CSS最低版本. 01. CSS背景属性(Background) 属 ...
- CSS笔记--选择器
CSS笔记--选择器 mate的使用 <meta charset="UTF-8"> <title>Document</title> <me ...
- HTML5学习笔记之表格标签
HTML5学习笔记之表格标签 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记之基础标签 HTML5学习笔记之表格标签 HTML5学习笔记之表单标签 HTML5学习笔 ...
- CloudNotes之桌面客户端篇:增强的笔记列表
今天,我发布了CloudNotes的一个更新版本:1.0.5484.36793.这个版本与1.0.5472.20097不同的是,它拥有增强的笔记列表,与之前单调的列表系统相比,新的笔记列表不仅可以显示 ...
随机推荐
- JavaScript:详解 Base64 编码和解码
Base64是最常用的编码之一,比如开发中用于传递参数.现代浏览器中的<img />标签直接通过Base64字符串来渲染图片以及用于邮件中等等.Base64编码在RFC2045中定义,它被 ...
- CAD启动提示"是否关闭命令行"不管点击什么,都会闪退的解决办法
AutoCAD splash screen starts up and then closes AutoCAD splash screen starts up and then closes (S ...
- es6新语法Object.assign()
1.介绍 Object.assign用于对象的合并,将源对象的所有可枚举属性复制到目标对象,只拷贝源对象自身的属性继承属性补考呗 Object.assign(target,source1,...)第一 ...
- glom模块的使用(二)
上次我们说到golm的简单应用这次我们继续带结构化数据的其他操作进行学习. Literal 用法:class glom.Literal(value) 这个方法的功能主要是添加自定义的键值. 例如: f ...
- 苹果的浏览器safari无法识别 2016-1-1这样的日期,会返回Invalid Date
1.很多时候我们遇到的日期是2016-1-1这样的,中间是带横线的,但是有时候我们需要转化为标准的时间,即使用new Date(time)这样的方法,这时在safari浏览器里面Invalid Dat ...
- PGSql
http://www.yiibai.com/postgresql/ http://www.postgresql.org/ http://blog.csdn.net/wulex/article/deta ...
- 当array_filter函数的callback留空时 他会过滤掉所有键值为false的键
当array_filter函数的callback留空时 他会过滤掉所有键值为false的键
- Unity 软件使用事项
打开旧版工程 目前发现两种方式来触发升级程序: 1.Unity软件启动时选择旧版工程,触发更新 2.直接打开旧版工程的场景文件,触发更新 在使用中发现一种错误做法,不知道是不是共性问题,在此先记录 ...
- procedure of object 对象的函数指针
应用:http://www.cnblogs.com/del88/p/6361117.html 有 class of object ----- 类的类型 那么自然有 方法的类型,方法的类型 分为两种: ...
- mysql的两种存储引擎
MySQL 有多种存储引擎,目前常用的是 MyISAM 和 InnoDB 这两个引擎,除了这两个引擎以为还有许多其他引擎,有官方的,也有一些公司自己研发的.这篇文章主要简单概述一下常用常见的 MySQ ...