列表

91 阅读1分钟

列表

HTML提供了3组常用的用来展示列表的元素

  • 有序列表:ol,li
  • 无序列表:ul,li
  • 定义列表:dl,dt,dd

dl dt dd

dl 定义列表,直接子元素之能事dt dd

dt 列表中每一项的项目名

dd

  • 列表中每一项的具体描述 是对dt的描述 解释 补充
  • 一个dt后面一般紧跟着一个或者多个dd

dt dd常见的组合

  • 事物的名称 事物的描述
  • 问题 答案
  • 归属名 归属于这类的各种事物

列表相关的css属性

  • 列表相关的常见css属性有4个:list-style-type,list-style-image,list-style-position,list-style
    • 他们都可以继承,所以设置给ol.ul元素,磨人也会应用到li元素

list-style-type

设置li元素前面标记的样式

  • disc实心圆
  • circle空心圆
  • square实心方块
  • decimal阿拉伯数字
  • lower-roman小写罗马数字
  • upper-roman大写罗马数字
  • lower-alpha小写英文字母
  • upper-alpha大写英文字母
  • none什么也没有

一般常用的就是none 配合p0+m0使用

padding:0

margin:0

内外边距为0

list-style-image

设置某张图片为li元素前边的标记,会覆盖list-style-type的设置

list-style-position

设置li元素前面标记的位置,可以去outside,inside2搁置

list-style

是list-style-type,list-style-image,list-style-position的缩写属性

list-style:outside url("images/dot.png")