猿问

如何让div标签直接出现在前一个div标签的右侧

我有以下 HTML 代码:


<!DOCTYPE html>

<html>

<head>

    <title>test</title>

    <style>

        .left {

            width: 30px;

            background-color: green;

        }

        .right {

            background-color: red;

            width: 30px;

        }

    </style>

</head>

<body>

    <div class="left">Text</div>

    <div class="right">Text</div>

</body>

</html>

红色 div 出现在绿色 div 的正下方,但我想让红色 div 直接位于绿色 div 的右侧 - 我应该怎么做?添加 float: right css 属性不起作用,因为它会转到页面的另一侧。


收到一只叮咚
浏览 106回答 1
1回答

守候你守候我

.left {&nbsp; &nbsp; float: left;&nbsp; &nbsp; width: 30px;&nbsp; &nbsp; background-color: green;}.right {&nbsp; &nbsp; float: right;&nbsp; &nbsp; background-color: red;&nbsp; &nbsp; width: 30px;}&nbsp; &nbsp; <div class="left">Text</div>&nbsp; &nbsp; <div class="right">Text</div>你必须使用浮动来实现这一点<!DOCTYPE html><html><head>&nbsp; &nbsp; <title>test</title>&nbsp; &nbsp; <style>&nbsp; &nbsp; &nbsp; &nbsp; .left {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; float: left;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; width: 30px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; background-color: green;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; .right {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; float: right;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; background-color: red;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; width: 30px;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; </style></head><body>&nbsp; &nbsp; <div class="left">Text</div>&nbsp; &nbsp; <div class="right">Text</div></body></html>
随时随地看视频慕课网APP

相关分类

Html5
我要回答