网页背景居中的方法有很多种的。这里介绍一些用CSS让背景图片居中的方法。

让背景图片居中的第一个方法是用像素设定,很多都用这种,但是也是最麻烦的:
<div style="width:800px;height:600px;background:url(../images/logo.jpg) no-repeat 250px 270px;border:1px solid #cccccc;"></div> 第二种居中方法:用50%设定,很方便:
<div style="width:800px;height:600px;background:url(../images/logo.jpg) no-repeat 50% 50%;border:1px solid #cccccc;"></div> 第三种:用center设定(第2个center可以省略)
<STYLE TYPE="text/css">
<!--
BODY {background-image: URL(../images/logo.jpg);
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;}
-->
</STYLE>

用CSS让网页背景图片居中的方法的更多相关文章

  1. 【Python全栈-CSS】CSS实现网页背景图片自适应全屏

    CSS实现网页背景图片自适应全屏 功能:实现能自适应屏幕大小又不会变形的背景大图,而且背景图片不会随着滚动条滚动而滚动. 以下是用CSS实现的方法: <html> <head> ...

  2. CSS实现网页背景图片自适应全屏

    一张清晰漂亮的背景图片能给网页加分不少,设计师也经常会给页面的背景使用大图,我们既不想图片因为不同分辨率图片变形,也不希望当在大屏的情况下,背景有一块露白,简而言之,就是实现能自适应屏幕大小又不会变形 ...

  3. CSS实现网页背景图片自适应全屏,自适应背景图片

    一张清晰漂亮的背景图片能给网页加分不少,设计师也经常会给页面的背景使用大图,我们既不想图片因为不同分辨率图片变形,也不希望当在大屏的情况下,背景有一块露白,简而言之,就是实现能自适应屏幕大小又不会变形 ...

  4. CSS中让背景图片居中且不平铺

    background:url(../images/logo.jpg) no-repeat center ;

  5. css如何使背景图片水平居中

    CSS中定位背景图片的属性是:background-position,用法background-position 属性设置背景图像的起始位置. 你要水平居中可以: div{background-pos ...

  6. IE/Chrome背景图片居中1px偏移解决方法

    最近在支持行业运营的一个推广页面,遇到了非常规的页面banner图居中的问题,为了解决此问题,做了简单的测试,做了一个小结,为经常做大促页面的兄弟姐妹们提供参考解决方案. 首先来看看现象.最经典的页面 ...

  7. css代码添加背景图片常用代码

    css代码添加背景图片常用代码 1 背景颜色 { font-size: 16px; content: ""; display: block; width: 700px; heigh ...

  8. 用extract-text-webpack-plugin提取出来的css文件中背景图片url的不正确的问题

    在一个main.js中require一个scss文件,scss文件中用了背景图片,图片url是用的相对路径,用extract-text-webpack-plugin插件提取出的css文件背景图片路径不 ...

  9. !!!css如何让img图片居中?css的display属性实现图片居中(代码实例)

    在我们开发前端页面的时候,为了让页面效果美观,会让图片呈现居中效果.那么css怎么让img图片居中显示呢?本篇文章给大家带来css如何让img图片居中?css的display属性实现图片居中(代码实例 ...

随机推荐

  1. hdu4638Group

    http://acm.hdu.edu.cn/showproblem.php?pid=4638 求某一区间所包含的连续的段 对于乱序的数 到了i这个数所包含的段数 首先把这个数看作单独的段 再看一下前面 ...

  2. poj 1840 Eqs (hash)

    题目:http://poj.org/problem?id=1840 题解:http://blog.csdn.net/lyy289065406/article/details/6647387 小优姐讲的 ...

  3. 2009国家集训队小Z的袜子

    莫队算法? 感觉没什么优越性啊?难道就是因为在排序的时候cmp函数的不同?这样做为什么减少时限啊? 我带着疑惑敲了代码,却一直有bug…… 代码: type node=record l,r,id,x, ...

  4. linux下nagios的安装与部署

    一.Nagios简介 Nagios是一款开源的电脑系统和网络监视工具,能有效监控Windows.Linux和Unix的主机状态,交换机路由器等网络设置,打印机等.在系统或服务状态异常时发出邮件或短信报 ...

  5. 先前设定的sa密码忘记了,如何修改sa密码?

    在window身份验证登陆后,新建查询,输入以下代码就可以修改sa密码了: use master go exec sp_password null,'123456','sa' go

  6. C#中如何截取Windows消息来触发自定义事件

    原文 C#中如何截取Windows消息来触发自定义事件 在c#windows开发中,我们常常会遇到拦截windows消息,来触发某个特定任务的问题. 由于目前使用c#的开发人员非常多,而且大多数c#程 ...

  7. 关于C#中static静态变量

    C#静态变量使用static 修饰符进行声明,在类被实例化时创建,通过类进行访问不带有 static 修饰符声明的变量称做非静态变量,在对象被实例化时创建,通过对象进行访问一个类的所有实例的同一C#静 ...

  8. 黑盒测试用例设计方法&理论结合实际 -> 错误推断法

    一 概念 基于经验和直觉推测程序中所有可能存在的各种错误, 从而有针对性的设计测试用例的方法. 二 错误推断法的应用  基本思想:列举出程序中所有可能有的错误和容易发生错误的特殊情况,根据他们选择测试 ...

  9. WebDriver 运行模式下使用rc 代码

    selenium2 对之前的rc 代码提供了兼容性接口,如果你之前的code 都是用rc 写,而现在又想摆脱要每次启动server,你只需要 略做修改即可.代码如下: public class Tes ...

  10. jenkins+ant+ssh远程部署服务glassfish

    jenkins安装可以参考官网或自己百度,这里不再说明: jenkins版本2.19.2 这里先说一下目的:主要是通过jenkins实现glassfish的部署,源码使用的是svn,编译是使用ant, ...