平铺的背景

当背景图片被一起加入后,就变得更富有创造性了。用Photoshop或者你喜欢的图片编辑器,创建一个10*10的图片,图片的顶部有黑色的边框,渐变的灰色一直到底部,象图2-6显示的。

图2-6:A 在Photoshop中创建10×10点大小的图片

图2-6:A 在Photoshop中创建10×10点大小的图片(被放大了)

我们可以用CSS把这个极小的图片平铺在<h1>的底部:

h1 {
font-family: Arial, sans-serif;
font-size: 24px;
color: #369;
padding-bottom: 14px;
background: url(10x10.gif) repeat-x bottom;
}

repeat-x会通知浏览器仅在水平方向平铺(repeat-y 将在垂直方向平铺)。我们再把图片设置在bottom,又增加了额外的padding-bottom,我们可以调节平铺的图片和上面文字之间的距离。(看图2-7)

图2-7: 带有平铺背景的标题 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值