圖片下如何添加文字html_html css怎麼樣才能把文字放在圖片的正下方

㈠ 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和CSS布局：

<!DOCTYPEhtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>圖片上寫字</title>
<styletype="text/css">
span{
position:absolute;
left:200px;
color:#fff;
font:50px/350px'微軟雅黑';
}
</style>
</head>
<body>
<imgsrc="pic.jpg">
<span>我是文字</span>
</body>
</html>

二、在開發工具裡面的截圖：

四、總結一下：這個是在body裡面添加一下背景圖片，然後再建div就可以布局。

㈢ 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+css怎麼在圖片上添加文字

html+css在圖片上添加文字有兩種方法如下：

1.添加一個DIV，採用絕對定位，圖片所屬DIV為基準

<div style="position:relative;width:100px;height:100px;">
<img src="" alt="" />
<div style="position:absolute;width:100px;height:100px;z-indent:2;left:0;top:0;">
文字
</div>
</div>

第二種方法:圖片作為背景圖片

<div style="background:url(abc.jpg) no-repeat left top;">
wenzi
</div>

背景圖片現在有了，然後在上面寫上你需要寫的字就可以了。

㈤ HTML如何在圖片上添加鏈接文本

需要准備的材料分別有：電腦、瀏覽器、html編輯器。

1、首先，打開html編輯器，新建html文件，例如：index.html。

㈥在HTML中，怎麼在圖片上添加文字

一種方式:直接將這個圖用ps處理，還有一種html裡面有層級代碼，修改代碼將字這一層放在圖片上面

方法1: ps寫在圖片上

方法2: 給標簽加入圖片背景, 在標簽裡面寫字

方法3: 使用img載入圖片, 樣式設置為固定或絕對定位, 添加樣式

z-index:-1;

然後寫字

<span>dadasdasdas</span>
<imgsrc="XXXX"style="background:rgb(142,107,249);position:absolute;left:0;top:0;width:100%;height:100%;">

㈦ html怎麼在圖片上加字

可以試試將圖片設置為背景，然後在裡面加文字，你加入的圖片代碼是：<img src="img.gif" width='100px" height="50px">你改成<div style="background:url('img.gif') no-repeat;width:100px;height:50px">這樣就可以圖片上加文字了</div>

㈧ html怎樣在圖片右側寫文字

1、首先先准備圖片素材和文字語言。

導航:首頁 > 圖片大全 > 圖片下如何添加文字html

圖片下如何添加文字html

與圖片下如何添加文字html相關的資料