CSS怎么将所有LI的内容排成一行

html-css012

CSS怎么将所有LI的内容排成一行,第1张

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

<html xmlns="

<head>

<meta http-equiv="Content-Type" content="text/html charset=utf-8" />

<title>景安网络</title>

<style type="text/css">

li{ display:inline}

</style>

</head>

<body>

<li>11</li>

<li>111</li>

<li>11</li>

</body>

</html>

使用display:inline将li转换为行内元素即可

首先得明白行内元素和块级元素。li 是块级元素,要想使两个LI并排成水平排列,得把块级元素转化为行内元素。帮你写的如下:

<style type="text/css"

ul li { float:left

list-style:none/*去掉li前的点标记*/

margin:5px/*外边距*/}</style<ul<li<a href="#"系部快讯</a</li