網頁設計中文字襯與圖片上方

1、網頁製作圖片和文字同處一行時 如何把文字放在最頂端啊

你的意思是圖片排版在文字下方嗎，在靜態頁里先<div>文字</div>，然後在加圖片，文字的css不加float:left:

2、html代碼 文字漂浮於圖片上面

一、image 作為背景圖片，即：background:url(".......");

例如如下代碼塊：

<div style="background:url('loading.gif') no-repeat;width:100px;height:50px">添加文字...添加文字...添加文字...</div>

二、將img塊與文字塊（文字塊採用span標簽顯示）放在同一個div 中，然後設置他們之間的位置，例如如下代碼塊：

<div style="position: relative; width: 170px; height: 89px;">

<img src="loading.gif" width="170" height="89" alt="">

<span style="position: absolute; top: 0; left: 0;">添加文字...添加文字...添加文字...</span>

</div> 

(2)網頁設計中文字襯與圖片上方擴展資料：

注意事項

position：absolute這個是絕對定位；是相對於瀏覽器的定位。

比如：position：absolute；left:20px;top:80px; 這個容器始終位於距離瀏覽器左20px,距離瀏覽器上80px的這個位置。

position：relative是相對定位，是相對於前面的容器定位的。這個時候不能用top left在定位。應該用margin。

比如：<div class="1"></div><div class="2"></div>

當1固定了位置。1的樣式float:left;width:100px; height:800px;

2的樣式為float:left; position：relative；margin-left:20px;width:50px;

2的位置在1的右邊，距離120px

3、網頁設計中如何讓把文字放在圖片上顯示

方法有很多
給你介紹一個最簡單的
<div
style="width:200px;
height:200px;
background-image:url(MDgxOTE3LXRoNXh4Nw==.jpg)">
div設置背景圖片
</div>
其次還可以通過div的定位來做
還有就是通過水印來做
總之更具不同的需求用不同的方法
靈活多變

4、如何實現網頁上在文字下面襯上圖片

2個方法 把圖片設置為背景圖片就可以了
<bg> 具體代碼我忘了 還有一個是用一個表格 把圖片設置為表格背景

5、通過CSS+DIV怎麼將文字寫在圖片上方

HTML圖片和文字是並列顯示的。如下：

1. 將文字浮在圖片上

我們加個div把圖片和文字包在一起，並且加上img-group和img-tip這兩個class，便於後面的處理。

我們要讓文字浮在圖片上面，需要加上定位。看文字浮在了圖片的底部。

display: inline-block;與定位無關，只是使整個.img-group長寬與圖片適應。

2. 文字與背景處理

文字左對齊，我們把文字居中。給.img-tip添加如下代碼：

文字不清楚，我們加上背景和字體顏色，並適當的設置一下透明。給.img-tip添加如下代碼：

3. 滑鼠懸浮特效

現在靜態效果已經完成了，接下來，加一下滑鼠懸浮出現文本的效果，現在.img-tip添加如下代碼，讓文本默認隱藏：

再加上滑鼠懸停在圖片上，顯示文本的代碼：

代碼總匯

HTML

<div class="img-group">  <img src="img/snow.png">
<div class="img-tip">我是雪豹</div></div>

CSS

.img-group {  position: relative;  display: inline-block;
}  
.img-tip {  position: absolute;  bottom: 0;  background: #333;  color: #fff;  opacity: 0.6;  display: none;
}  
.img-group:hover .img-tip {  display: block;  width: 100%;  text-align: center;
}

6、網頁設計如何在背景圖片上編輯文字

第一種、將背景圖寫在css中
<style>
.class{background: url("圖片路徑") no-repeat;}
</style>
接著就直接在html中寫文字內容。
第二種、寫在html中
<div class="screen">
<div class="img"><img src="images/logo.png" alt=""></div>
<div class="intro intro--shown"><p>你的文字內容</p></div>
</div>

css樣式,
.screen {
position: relative;
width: 1280px;
height: 720px;
overflow: hidden;
}
接著就是包裹的兩個div,圖片和文字
.img {
width: 100%;
height: 100%;
overflow: hidden;
border-radius: 7px;
position: absolute;
}
.intro {
position: absolute;
width: 100%;
bottom: -5px;
z-index: 20;
}
z-index: 20;就是可以將文字鎖定在你圖片的上方

7、html中怎麼讓文字在圖片的上面？

1、在div裡面書寫了一些文字，然後想要在放入一張圖片。

2、首先，我們應該先給div設置寬度和高度，保證文字有一個范圍。

3、然後通過background給div添加一張圖片作為它的背景。

4、通過url()來連接圖片，url裡面放置的就是背景圖片的路徑。

5、放一張圖片用作背景，注意，路徑要寫對。

6、保存之後文字就會覆蓋在圖片的上面了，而如果使用img標簽，則沒有這種效果。

8、如何將文字放在圖片上方（Word 里的）

有兩種方法

1、插入圖片之後，點中圖片右鍵選擇「設置圖片格式」，在「版式」選項里選擇「襯於文字下方」即可；

2、可作為背景，在格式背景選項里選擇「填充效果」，再選擇圖片也可，關鍵是看你需要哪種效果。

9、如何用CSS樣式控制文字浮於圖片上方

1、首先，我們應該先給div設置寬度和高度，保證文字有一個范圍。

2、然後通過background給div添加一張圖片作為它的背景。

3、接著可以通過url()來連接圖片，url裡面放置的就是背景圖片的路徑。

4、隨意地放了一張圖片用作背景，一定要注意，路徑要寫對。

5、這樣，保存之後文字就會覆蓋在圖片的上面了。