网页设计中文字衬与图片上方

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、这样，保存之后文字就会覆盖在图片的上面了。