您好,欢迎访问一九零五行业门户网

web字体浮在图像中央_html/css_WEB-ITnose

在做项目的过程中遇到了需要将图像作为背景,将字体显示在图像中央需求。
尝试了两种做法:
第一种方法为设置一个div设置属性为relative固定这个框的位置,将图片铺在div块里。
在div再设一个div存放字体,z-index设置为2,及图片在下面,字体在上面,字框的属性设置为absoulte(绝对定位)。
这样就可以设置字体对于图像的偏移,具体代码如下:
字体

缺点:如果字体是可变的,则不好设置偏移的位置。图像也不是自适应,在不同的浏览器中效果也不相同
第二种方法为将图像作为背景,字体居中显示。
具体代码如下:
#text{ background: url(/images/mobile.jpg); filter: progid:dximagetransform.microsoft.alphaimageloader(sizingmethod='scale'); -moz-background-size: 100%100%; background-size: 100%100%;} 字体

其它类似信息

推荐信息