禁止背景图在网页中平铺

网页

如果我们希望在网页的不同角落里放置不重复平铺的背景图,该怎么办呢?
  比如网页的背景要如图所示,并要求在不同的分辩率下该背景图都显示在右下角,想想看,有办法吗?

  想将它做成一张大图?!不行,不同的分辩率,图的大小不同呀,你只能做一张背景。怎么办呢???

  别担心,你只需要下面这个背景就好了:

  也许你会说,看起来不可以呀,才这么一张小图,而且网页背景都是平铺的嘛!

  别担心,你忘记CSS了?在Dreamweaver中做起来其实一点不困难。首先建立一个新样式,如图:

  在样式中,选“Background”选项,再在右边进行设置,本例首先在“Background Image”选项中输入背景图像的路径,就是刚才所切的小图。
  “Repeat”是问你是否重复的平铺背景图,这里是单张效果,当然不希望平铺,所示设置成“no-repeat”。
  “Attachment”选项是问你图像位置是否固定,设置“Fixed”,表示固定。
  “Horizontal”是水平位置,这里选“right”表示居右。
  “Vertical”是垂直位置,这里选择“bottom”,表示靠底。

  这样,定义好的这个样式,不仅可以应用到页面的背景,甚至可以用到表格、单行格中去。大家用Dreamweaver来编辑一下,研究一下。

时间: 2024-10-30 05:12:28

禁止背景图在网页中平铺的相关文章

关于CSS控制背景图的问题

于想设置可变背景,所以想用CSS控制背景图 如果单是改变颜色的可以实现 但在用背景图时设置平铺无效 以下代码直接放在应用的网页中没有问题 但放在CSS里时,只能显示实际大小的背景图,无论设置平铺还是其它都没有改变 各位兄弟来支支招,先谢谢了, 代码: <style type="text/css"> <!-- body {         background-image: url(/目录1/目录2/bg.jpg);         background-repeat:

jquery动态更换网页背景图的方法

 这篇文章主要介绍了jquery动态更换网页背景图的方法,需要的朋友可以参考下 有些时候,我们可以为用户提供很贴心的功能,比如判断用户是什么时候来访问的,然后给出一句问候,晚上好,下午好之类的.并且更换网页的背景颜色,比如晚上的时候就可以用满天星星的背景,白天就用阳光灿烂,或者特定节日就用该主题背景,让你的网站显得非常灵活,不枯燥.   下面就如何实现背景更换给出一种解决方法:   如何实现   很简单,下面是 JQuery 代码:    代码如下: function doChangeBkg()

鼠标样式,整体背景图,滚动条的效果(网页效果)

鼠标样式|网页 变鼠标样式:<Body style='cursor:url(image/mouse.cur)' bgColor=#ffffff> 整体背景图:<STYLE type=text/css>BODY {BACKGROUND-IMAGE: url(image/bg1.gif)}</STYLE> 滚动条的效果:<style type="text/css">BODY {SCROLLBAR-FACE-COLOR: #ffffff; SC

css html-html背景图平铺浏览器问题

问题描述 html背景图平铺浏览器问题 拿到ui设计的背景图,直接设置宽高100%,会导致图片变形,各位大牛有什么好的解决方法吗? 解决方案 http://www.itnose.net/detail/6110755.htmlhttp://blog.sina.com.cn/s/blog_a7b8ab2801019lh7.html 解决方案二: http://blog.csdn.net/liuliang841210/article/details/39993541

CSS实例教程:PNG背景透明在网页设计中的运用

文章简介:PNG的背景透明在网页中应用比较广泛,但浏览器的兼容问题一直很让人头疼,用的CSS滤镜再变通一下也能实现PNG背景半透明的兼容问题,只不过不支持背景的定位而已,也就是说不支持CSS SCRIPT. PNG的背景透明在网页中应用比较广泛,但浏览器的兼容问题一直很让人头疼,用的CSS滤镜再变通一下也能实现PNG背景半透明的兼容问题,只不过不支持背景的定位而已,也就是说不支持CSS SCRIPT. 一.CSS 滤镜(两种方法) 一般能用CSS处理的就尽量不要用JS了,个中的原因,你懂的--

背景图的详细设定

原本<body>卷标提供了以下几种设定:  <body  alink=colorvalue  background=url  bgcolro=colorvalue  link=colorvalue  text=colorvalue  bgproperties=fixed /*背景固定  leftmargin=pixels /*离浏览器显示窗左边的距离  topmargin=fixels /*离浏览器显示窗上面的距离  >  HTML 3.2所能用的设定非常有限,但在CSS 2.0 

高度自适应与各列背景图自适应延伸之完美解决方案

解决|自适应 一直以来关于高度自适应的问题,确切的说应该是背景自适应的问题,因为许多布局中,需要将背景随着高度的自动变化而平铺,而过去在网上找到的许多高度自适应解决方案并没有真正解决背景图自适应平铺这一难点,这对于追求完美的我来说是个头疼的问题,幸运的是功夫不负有心人,终于在国外的一个站点上找到了新的两全其美的解决办法,并在IE和FF中测试通过! 说它完美,是因为它有以下特点:1.高度自适应2.各列背景图自适应平铺3.无论是一列.两列.还是三列...都可以轻松控制它们自适应(即各列等高)4.可以

用Photoshop制作无缝拼接背景图

所谓无缝拼接背景图,即是整幅图像可以看做是由若干个矩形小图像拼接而成,并且各个矩形小图像之间没有接缝的痕迹,小图像之间也完全吻合.这种无缝拼接图像在日常生活中也很常见,如地面上铺的地板革.墙纸.花纹布料.礼品包装纸等.无缝拼接图像在电脑图像处理上应用广泛,特别是在一些平面设计和网页背景方面.如果用它对主题内容进行烘托,不仅美观别致,而且简便易行,又不至于浪费大量的时间和空间.下面以制作花布纹理图案和人物拼图为例来说明. 花布纹理图案 制作花布纹理风格图案的具体步骤如下(制作软件以Photosho

渐隐背景图象的制作方法

渐隐 本文为本站原创,转载请注明出处 在我们制作网页的过程中,经常会对图片进行修饰,从而使网页达到一种较好的效果.今天我就给大家介绍一篇如何得到渐隐背景图象的特效. 第一步:打开Fireworks 2004 mx 新建一个文件,大小自己根据所选择图片的大小合适,背景蓝色,之后通过"file/import"导入一幅要修饰的图片:如图1所示: 第二步:选择矩形工具,画一个矩形,矩形的大小正好覆盖我们所导入的图片.如图2所示: 第三步:然后选择矩形,在属性面板中选择线性渐变填充效果,颜色设置