内容营销

轻松完成身体背景图片

在许多站点上都可以找到的一个不错的功能是,中心内容区域似乎覆盖了页面,并在页面后面放置了阴影。 实际上,这是一种非常简单的方法,可以通过单个背景图像使您的博客(或其他网站)看起来不错。

怎么做

  1. 找出内容的范围。 例如:750px。
  2. 在您的插图应用程序(我使用Illustrator)中构建比内容区域宽的图像。 例如:800px。
  3. 将图像的背景设置为您希望博客两边都具有的背景。
  4. 在背景上添加白色区域。
  5. 在从该区域的任一侧突出的白色区域上应用阴影。
  6. 将裁切区域的宽度设置为高1像素。 这将使下载的图像美观且紧凑,可以快速渲染。
  7. 输出图像。

这是我使用Illustrator构造它的方式(请注意,我的作物区域高得多……这是为了让您可以看到我在做什么):
与插画家背景

这是输出与背景图像的外观示例:
背景图片示例

这是在您的身体中使用身体样式标签应用图像的方法

的CSS 文件中。

背景:#B2B2B2 url('images / bg.gif')重复-y中心;

以下是背景样式标签的剖析:

  • #B2B2B2 –设置页面的整体背景色。 在此示例中,为灰色以匹配背景图像上的灰色。
  • url('images / bg.gif')–设置您要使用的背景图像。
  • 重复y –将图像设置为在y轴上重复。 因此背景图片将从页面顶部到底部重复。
  • center –将图像设置在页面中心。

简单易用...一张图片,一张样式标签!

Douglas Karr

Douglas Karr 首席营销官是 开放洞察 和创始人 Martech Zone。 道格拉斯帮助了数十家成功的 MarTech 初创公司,协助进行了超过 5 亿美元的 MarTech 收购和投资尽职调查,并继续协助公司实施和自动化其销售和营销策略。 道格拉斯是国际公认的数字化转型和 MarTech 专家和演讲者。 道格拉斯还是一本傻瓜指南和一本商业领导力书籍的出版作者。
返回顶部按钮
关闭

检测到Adblock

Martech Zone 我们能够免费为您提供这些内容,因为我们通过广告收入、联属链接和赞助从我们的网站中获利。 如果您在浏览我们的网站时删除广告拦截器,我们将不胜感激。