How to arrange the CSS list horizontally: You can use the [display:inline] attribute to set the [
] tag as an inline element to achieve the horizontal arrangement effect. The display attribute specifies the type of box the element should generate.
css video tutorial)
Attribute introduction: The display attribute specifies the type of box that the element should generate. Specific code:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>列表横向排列的另一种方法</title>
<style type="text/css">
ul li{display:inline;background:#F93; padding:5px;}}
</style>
</head>
<body>
<ul>
<li>Item1</li>
<li>Item2</li>
<li>Item3</li>
<li>Item4</li>
</ul>
</body>
</html>
##Problem:
li between There is a gap
Solution:
Write li in one line
<ul>
<li>Item1</li><li>Item2</li><li>Item3</li><li>Item4</li>
</ul>Effect:
##Related recommendations:
CSStutorial
The above is the detailed content of How to arrange CSS list horizontally. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
