简单CSS:如何使图片居右,而与文字不在同一行?

发布网友发布时间：2022-04-20 22:15

我来回答

共5个回答

热心网友时间：2022-04-21 01:58

1、首先找到一款html编辑器，如：打开DW软件，ctrl+n创建一个html文件，如题：使图片靠右，与文字不在同一行，找到一张图片，并且设置图片居右，文字另起一行写入：如下

详解：图片img设置的float:right;靠右浮动，p标签在其下面，所以要加个清楚浮动的效果；样式中定义了clear也可以写成：<div class="clear"></div>效果是一样的；

图片靠右浮动，文字另起一行展示主要css属性用于：clear:both;清除左右浮动，both换成left:清除左浮动，right是清除右浮动；不添加就会在底层展示；看着是在同一行实则不然，他们在两个层里展示的；

2、页面展示效果：如下

热心网友时间：2022-04-21 03:16

先说明一点你的想法就是错的

文字的图片不在同一行那就是二行了

一行内空居右一行内容居左就行了不存在什么浮动

浮动是二个元素在同一行才使用不在同一行用不着浮动

<div style="background:#F33; width:400px; height:600px; margin:0 auto">
<p style="text-align:right;"><img src="http://su.bdimg.com/static/superplus/img/logo_white_ee663702.png" width="150" /></p>
<p style="text-align: center;">百度（Nasdaq简称：BIDU）是全球最大的中文搜索引擎，2000年1月由李彦宏、徐勇两人创立于北京中关村，致力于向人们提供“简单，可依赖”的信息获取方式。“百度”二字源于中国宋朝词人辛弃疾的《青玉案·元夕》词句“众里寻他千百度”，象征着百度对中文信息检索技术的执著追求。</p>
</div>

热心网友时间：2022-04-21 04:50

给他们的总体设置一个div，让其浮动靠右，图片文字都放在里面不就OK了追问可是我想文字段落是居中的。

热心网友时间：2022-04-21 06:42

那你就不要用浮动，把float这个去掉。浮动是脱离文档流的。追问可是我想文字段落是居中的。

热心网友时间：2022-04-21 08:50

p{display:block;
float:right;}追问可是我想文字段落是居中的。

追答文字居中的话，就在父标签元素属性里加text-align: center;

想让p标签居中的话就在P标签里加margin:0 auto;