css怎样设置ul的li 居中均匀排列

html-css013

css怎样设置ul的li 居中均匀排列,第1张

css设置ul的li 居中均匀排列,我们首先需要做的就是将这个ul的width和height确定,使用margin让ul居中,margin的用法如图:

,然后在设置li的width和height,然后给li一个float,通过代码来理解:

<html>

<head>

<style>

ul{

width:300px

height:30px

border:1px solid #f00

marign:0 auto

}

li{

width:50px

height:30px

float:left

}

</head>

<body>

<ul>

<li>名字1</li>

<li>名字2</li>

<li>名字3</li>

<li>名字4</li>

</ul>

</body>

</html>

1、参照栅格系统

2、两端对齐

1)text-align:justify

2)text-align-last:justify

3、css3 flex

一. 基本概念

1.层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。

2.CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。

二. 编程工具

1.记事本:使用Windows系统自带的记事本可以编辑网页。只需要在保存文档时,以.html为后缀名进行保存即可。

2.Dreamweaver:它与Flash、Fireworks并称网页三剑客。Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器,它是第一套针对专业网页设计师特别开发的视觉化网页开发工具,利用它可以轻而易举地制作出充满动感的网页。