无序列表

说明

ul标签定义的是表格当中无序列表，表格当中的无序列表都是在<ul>标签之中，无序列表都是和<li>标签在一起使用的。普通的显示数据的时候，ul就是项目列表，li就是列表项。两个合起来就可以用来显示数据。

语法

<ul><li></li>
</ul>

演示

------代码

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>无序列表</title>
</head>
<body><ul><li>无序列表</li><li>无序列表</li><li>无序列表</li><li>无序列表</li><li>无序列表</li></ul>
</body>
</html>

------效果

属性

属性	值	描述
compact	compact	不赞成使用。请使用样式取代它。规定列表呈现的效果比正常情况更小巧
type	disc square circle	不赞成使用。请使用样式取代它。规定列表的项目符号的类型。

默认样式

<ul>

ul{display: block;list-style-type: disc;margin-block-start: 1em;margin-block-end: 1em;margin-inline-start: 0px;margin-inline-end: 0px;padding-inline-start: 40px;
}

<li>

li {display: list-item;text-align: -webkit-match-parent;
}

清除默认样式

ul,li {list-style: none;padding: 0px;margin: 0px;margin-block-start: 0px;margin-block-end: 0px;padding-inline-start: 0px;}

清除完的效果

HTML5入门之无序列表相关推荐

HTML5入门之有序列表
HTML5入门之有序列表有序列表说明语法演示 ------代码 ------效果属性 reversed属性代码效果 type属性代码效果 start属性代码效果默认样式 < ...
今天学习了无序列表和有序列表和使用HTML5创建表格
ol建立有序列表,该列表可以用设置type="A/a" 其语法架构为 <ol> <li></li> <li></li> ...
html5有序列表无序列表自定义列表
html5有序列表无序列表自定义列表 1.无序列表无序列表代码如下 <h2>1.无序列表</h2><p>你喜欢的水果有哪些</p><ul> ...
怎么改变html无序列表的字号,html无序列表代码 html5 无序列表的行距怎么设置
html语句怎么实现无序列表并排?就是两列怎么实现无序列表并排111 无序列表并排222 css: - #list li{float:left;} float浮动就行了,最好给ol和li设定固定宽度 ...
web无序列表去掉点_web前端入门到实战：css如何玩转有序无序列表项list样式
在无序列表ul>li中,无线列表的标志是出现在各列表前面的圆点.在有序列表ol>li中,前面默认带有数字,如何修改列表前面的项目符号,只需要通过list-style调整就好,常见的符号有( ...
html无序列表空心圆_列表样式的使用CSS入门基础（018）
今天我们分享关于列表样式的内容.列表项list-sytle-type:在HTML学习中,我们知道有有序列表和无序列表,都是使用type属性来定义的.1.有序列表有序列表有序列表有序列表属 ...
html 无序列表编程一排_HTML 入门笔记
HTML是什么? 超文本标记语言(英语:HyperTextMarkupLanguage,简称:HTML)是一种用于创建网页的标准标记语言.HTML是一种基础技术,常与CSS.JavaScript一起被 ...
html5无序列表，有序列表，定义列表，组合标签，div分区标签
<!DOCTYPE html > <html lang="en"> <head><meta charset="UTF-8&quo ...
html5如何实现无序排列,无序列表让li横排
html中的无序列表ul和li水平排列取代表格的问题怎么设在html中无序列表之间的距离垂直排列行间距:line-height:25px 水平排列:margin:0px 5px;(左右各有5像素 ...

HTML5入门之无序列表

HTML5入门之无序列表

无序列表

说明

语法

演示

------代码

------效果

属性

默认样式

<ul>

<li>

清除默认样式

清除完的效果

HTML5入门之无序列表相关推荐

最新文章

热门文章