在CSS样式中增加一项：
.header_top_right {width: 30%（注：这个根据需靠右对齐的文字的宽度设，也可以用px单位）float: righttext-align: right}
在页面中：
<div class="header_top1"><span>欢迎光临某某某网站 </span>
<div class="header_top_right">登录</div>
</div>
希望有帮助。
<html><head>
<meta charset="utf-8">
<title>图文混排</title>
<style>
/*左右排版*/
.clearfix{clear: both}
.column{width: 30%position: absolutebackground-color:blue}
.tukuang{broder:1px black solid}
.tukuang img{float: leftwidth: calc(100% / 2 - 10px)margin:5pxborder-radius: 10%position: relative}
.img{width: 50%position: relativebackground-color:black}
.text{float: rightwidth: calc(50% - 10px)background-color:redposition: absolutetop:5pxright:5px}
</style>
</head>
<body>
<div class="column">
<div class="img">
<div class="tukuang">
<img src="images/m1.jpg">
</div>
<div class="tukuang">
<img src="images/m2.jpg">
</div>
<div class="tukuang">
<img src="images/m3.jpg">
</div>
<div class="tukuang">
<img src="images/m4.jpg">
</div>
</div>
<div class="text">
文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域
文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域文本内容区域
</div>
<div class="clearfix"></div>
</div>
</body>
</html>
/*好久没写生疏了 */
