DIV+CSS中图片居中,文字环绕图片的四周显示的代码怎么写?

DIV+CSS中图片居中,文字环绕图片的四周显示的代码怎么写?,第1张

是这样 BODY是指页面 那么定义居中是指页面内部元素居中 所以
text_align:center是针对像BODY这样的父元素的(当然指IE都知道)
margin:0 auto是针对父元素内要约束的子元素的(指标准都知道)
所以 你这个要想居中 内部可拟定个子元素 比如BOX吧 然后定义:
body{text-align:center;}
#box{margin:0 auto;}
HTML码:
<body>
<div id="box"></div>
</body>
分就不用了 希望对兄弟有用就好

方法很分多,可以把和文字分别放在div中然后浮动即可。

我写一个给你,稍等!

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
  img{
    float: left;
  }
  </style>
</head>
<body>
  <div>
    <img src="test1jpg" alt="">
    <ul>
      <li>地址:</li>
      <li>电话:1111111111</li>
      <li>联系人:大大大大大大</li> 
    </ul>
  </div>
</body>
</html>

你自己再改一改,有用就采纳!

<p>假设这是一个段落,假设这是一个段落假设这是一个段落假设这是一个段落假设这是一个段落假设这是一个段落<img src="testjpg" style="float:left" />假设这是一个段落假设这是一个段落假设这是一个段落假设这是一个段落假设这是一个段落</p>

说明:最简单的图文并茂是非常简单的,直接把img标签加入到文字中,给设置float即可,如果位置不合适可以调整img在文字中的位置,这种字体会自动环绕。

=======
文字环绕
=======
<style>
div {
width:300px;
border:1px solid red
}
img {
float:center;
width:100px;
height:100px
}
</style>
<div>
<img src="/images/logogif" />
绕啊绕啊
绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊 绕啊绕啊
</div>
=======
居中
======
<center><img src="img/logogif"></center> <!--html-->
==============================================
<!---css-->
========
div{
margin:0 auto;
padding:0px;
}
<div id="logo">
<img src="img/logogif">
</div>
CSS的定义:
#logo{width:500px; height:300px;}
#logo img{margin-top:100px; margin-left:150px;}
=================================
可以把让先居中,后环绕。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/13322651.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-07-14
下一篇 2023-07-14

发表评论

登录后才能评论

评论列表(0条)

保存