这里贴一个常见的小问题,在背景图片上做文字,直接贴代码了,简单的一小段,

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>我是画画的小行家</title>
<style type="text/css">
/*div1下面 包含着1个图片和1段文字*/
#div1{
position: relative;
width: 1200px;
height: 340px;
}
/*图片部分的设置*/
#img1{
/*position: static;默认定位,可以省略*/
width: 100%;
height: 100%;
}
/*文字的设置*/
#span1{
position: absolute;
width: 100%;
bottom: 50px;
left: 0px;
text-align: center;
font-size: 28px;
color: white;
} 
</style>
</head>
<body>
<div id="div1">
<span id="span1">舒克舒克 贝塔贝塔</span>
<img src="C:/Users/tuotuo/Desktop/网站图2/banner.jpg" id="img1" />
/*这里要是网络图片的话就可以直接把本地地址换成图片URL即可*/
</div>
</body>
</html>

效果如图:

当然了,需要什么样的形式的文字,在什么位置,就需要你自己在css里加就好了,作者没办法都讲全。

发表评论

邮箱地址不会被公开。 必填项已用*标注

1 − 1 =