网页 div 图片和文字混排,想把图片靠右 文字靠左,并列排,怎么办呢?
发布网友
发布时间:2022-05-14 23:12
我来回答
共3个回答
热心网友
时间:2023-11-06 16:31
如果你的图片和文本都是在一个div里,形如:
<div>
<img src="" />
aaaaaaaaaaaaaa
</div>
那么就令img的,align=left,就可以了.
如果图片和文本分别在两个div里,如:
<div>
<div id="left">aaaaaaaaaaaa</div>
<div id="right"><img src="" /></div>
</div>
就可以.
#left{width:200px; float:left;}
#right{width:300px; float:right;}
参考资料:http://www.bjzero.net
热心网友
时间:2023-11-06 16:32
<div>
<div class="left">aaaaaaaaaaaa</div>
<div class="right"><img src="" /></div>
</div>
.left{float:left;}
.right{ float:right;}
热心网友
时间:2023-11-06 16:32
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>排版</title>
<style>
h1{
color: #666;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
line-height: 90%;
letter-spacing: -2px;
font-size: 40px;
padding-bottom:15px;
border-bottom:2px solid #8FC629;
}
p{
line-height:180%;
font-size:12px;
}
#layout{
width:700px;
margin:0px auto;
}
.pimg{
float:right;
padding:10px;
}
.pimg h3{
font-size:12px;
text-align:center;
color:green;
}
</style>
</head>
<body>
<div id="layout">
<h1>CSS FAQ</h1>
<p >文字</p> <div class="pimg"><img src="img.jpg" width="231" height="195" /><h3>CSS布局图示 1-1</h3></div>
<p>文字。</p>
<p > </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</div>
</body>
</html>