html让文字在图片的下面_html css怎么样才能把文字放在图片的正下方

㈠ HTML如何在图片下面打出文字

图片一个div文字一个div。或者图片和文字在一个div里，把图片的宽设置成100%。或者在图片后面加<br />标签。

㈡ html css怎么样才能把文字放在图片的正下方

代码如下：

需要显示的文字

</div>

<style>

.box{width:300px; text-align:center; font-szie:18px;}

.box img {width:100%;}

</style>

㈢ html css怎么样才能把文字放在图片的正下方

使用绝对定位position: absolute;让文字覆盖在图片上

<style>
.h-poti{position:relative;display:block;}
.h-potiem{position:absolute;bottom:10px;left:0;width:100%;text-align:center;}
</stle>
<spanclass="h-pot">
<i><imgsrc="img/b1-img.jpg"/><em>文字</em></i>
</span>

㈣ html中怎么让输入的文字显示在图片的下方

个人推荐你用个table，这样控制性强一些
详解：
<table>
<tr>
<td>
<img src="http://www..com/img/_logo.gif"/>
</td>
</tr>
<tr>
<td>
这里的文字在下方
</td>
</tr>
</table>
不懂html语言的话可以再次留言

㈤ html css怎么样才能把文字放在图片的正下方

<!DOCTYPE html>

<html>

<head>

<title>Document</title>

<style>

.d1{

width: 400px;

height: 250px;

background-color: red;

text-align: center;

}

</style>

</head>

<body>

<div>

<br/>

你啥时候嫁给我,hahahahaahahahahahaah

</div>

</body>

</html>

————————————————

这样就会能够将文字放在图片的正下方，得到以下图片：

文字位于正右边的方法：

<!DOCTYPE html>

<html>

<head>

<title>Document</title>

<style>

.d1{

width: 400px;

height: 250px;

background-color: red;

}

.d2{

vertical-align: middle;

}

</style>

</head>

<body>

<div>

你啥时候嫁给我

</div>

</body>

</html>

㈥ html在盒子内将文字放在图片下方

比较简单的做法就是，将他们放置一个盒子内，你想让文字跟图片居中，那么不一定要让图片当文字的参照物，而是让他们在大盒子内居中，不需要太复杂的框架结构，只需要利用样式的属性即可，并且各个浏览器都会正常显示，代码如下：
<div class="box">
<img src="6107.jpg">
这里是居中的文字
</div>
<style>
.box{width:300px; text-align:center; font-szie:18px;}
.box img {width:100%;}
</style>

㈦ HTML中，怎么在图片的下面加入文字啊

使用定位来写的，首先一个大盒子装着图片，

然后一个盒子装着头像和文字，把装着头像和文字

的盒子根据装着图片的盒子进行定位就可以了，

像这样的其实很简单的，要多思考和分析

代码，要注意图片你要自己放图片，和修改图片路径

<!DOCTYPE html>

<html>

<head>

<title>图片上放文字</title>

html,body{

margin:0;

}

.auto-img{

display: block;

width:100%;

}

.box{

width:100%;

margin-top: 50px;

}

.box-cent{

width:50%;

margin:0 auto;

position: relative;

}

.texbox{

position: absolute;

width:50%;

line-height: 80px;

background-color: #0f0;

text-align: center;

top:50%;

left:50%;

transform: translate(-50%, -50%);

}

</style>

</head>

<body>

<div class="texbox">我是用来装头像和文字的盒子</div>

</div>

</body>

</html>

导航:首页 > 文字图片 > html让文字在图片的下面

html让文字在图片的下面

与html让文字在图片的下面相关的资料