1

我们是否可以使用 html 或 javascript 在图像上编写文本。

我已经做到了

创建了一个 em 标签并在其中创建跨度，现在我们可以在跨度中写入任何文本并调整 em 标签的位置，使其出现在图像上。将 em 标签的 z-index 设置为比图像更大的值。然后看起来文本被写在图像上。

但我想提供一个选项，访问者可以使用它来编辑文本。我该怎么做？

代码示例：-

$("#em1").html("<p><span>Hi I am</span><br>
<span> Trying to </span><br><br>
<span> To write text</span></p>");


#em1{
    display: block;
    /*border: 1px solid black;*/
    position: absolute;
    top: 160px;
    right: 145px;
    z-index : 10;
}

我正在使用背景（空白 - 上面没有写任何东西）图像

4

3 回答 3

4

设置元素的contenteditable属性。em您可能需要告知用户可食用性，因为人们通常不会期望它，并且视觉外观中没有任何暗示。

于 2012-04-26T12:33:06.180 回答
1

你可以有一个文本区域

<textarea  class='abc' >Hello Boys</textarea>

应用了一些CSS。

.abc{



background: url('http://www.bzfusion.net/skymaps/sky_englishspring.jpg') no-repeat; 
background-color:red; 
width:300px;

    height:500px;
}​

于 2012-04-26T12:50:49.663 回答
0

这种特性的一个好的做法是在服务器端进行绘图。如果您真的需要在客户端上绘图，请使用 HTML5 画布。

如果您需要保存该图像，请阅读本文： http ://www.nihilogic.dk/labs/canvas2image/

于 2012-04-26T12:32:27.283 回答