用HTML的原生语法实现两个div子元素在同一行中排列
warning:
这篇文章距离上次修改已过443天，其中的内容可能已经有所变动。
要在HTML中使两个div元素在同一行中排列，可以使用CSS的display: inline或display: inline-block属性。以下是一个简单的例子：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Div Inline Example</title>
<style>
.inline-div {
display: inline;
margin-right: 10px; /* Optional space between divs */
}
</style>
</head>
<body>
<div class="inline-div">
<p>Div 1</p>
</div>
<div class="inline-div">
<p>Div 2</p>
</div>
</body>
</html>在这个例子中，两个div都应用了inline-div类，这个类通过设置display: inline属性使得div元素水平排列。如果需要在div之间添加空白，可以使用margin-right属性。
评论已关闭