链接图片背景代码

body {background: url('链接') no-repeat center 0;}

颜色代码

body{background:#FFF}

链接图片背景代码2

<body background="链接">

css实现自适应

.all_bg{

                position:fixed;

                top: 0;

                left: 0;

                width:100%;

                height:100%;

                min-width: 780px;

                z-index:-10;

                zoom: 1;

                background-color: #fff;

                background: url(背景链接);

                background-repeat: no-repeat;

                background-size: cover;

                -webkit-background-size: cover;

                -o-background-size: cover;

                background-position: center 0;

            }

然后在 <body> 之间引用已下内容：

<div class="all_bg"></div>

HTML引用CSS实现自适应背景图的更多相关文章

  1. webpack中，css中打包背景图，路径报错

    css-loader: //打包样式中背景图 { test: /\.(png|jpg)$/, loader: "url-loader?limit=8192&name=images/[ ...

  2. DIV+CSS+PS实现背景图的三层嵌套以及背景图的合并

    传说中的“三层嵌套技术”. 一.背景图合并: div+css+ps合图相结合的技术:通过精确到1px的css设置,使用ps合成背景图片,特别是小图片合并,来完成页面效果.         首先讲讲三层 ...

  3. vue-cli构建的vue项目打包后css引入的背景图路径不对的问题

    使用vue-cli构建vue项目后,再打包遇到一个css引入的背景图片路径的问题,就是css代码中背景图片是根据相对路径来写的,如下图: 当使用npm run dev命令本地访问的时候,背景图片是正常 ...

  4. css — 定位、背景图、水平垂直居中

    目录 1. 定位 2. 背景图 3. 水平垂直居中 1. 定位 position:static | relative | absolute | fixed; static 静态定位 relative ...

  5. 关于CSS设置页面背景图的一些疑问

    关于背景图片的位置其background-position设置背景图片的位置有两种方式,一种是是根据像素设置,第二种根据百分比设置,第一种根据像素的位置是很简单的,只是关于百分比这个设置理解特别容易出 ...

  6. 在css中设置图片的背景图，怎么设置图片纵向拉伸

    css中设置背景图拉伸填充,在css2.1之前这个背景的长宽值是不能被修改的. 实际的结果是只能重复显示,可以使用repeat,repeat-x,repeat-y,no-repeat这些属性来控制背景 ...

  7. vue-cli打包后dist文件运行空白和背景图显示问题详解

    1.文件引用路径.我们直接运行打包后的文件夹中的index.html文件,会看到网页一片空白,f12调试,全是css,js路径引用错误的问题. 解决:到config文件夹中打开index.js文件. ...

  8. CSS背景图怎么自适应全屏（手机或者电脑）

    #demo{ background-img:url(../bg.png); --(1)适用于上半部分背景图片,下半部分纯色 将背景图像等比缩放到完全覆盖屏幕,背景图有可能超出屏幕(容器) backgr ...

  9. css背景图自适应全屏显示

    前几天我在写一个前端页面的时候,需要用到全屏背景图,但是怎么写都不行(要么不全屏,要么不兼容Bootstrap的响应式布局).对,是我腊鸡 后来我在网上找的时候找到一个大神写的笔记,参(照)考(抄)之 ...

随机推荐

  1. 基于camunda开源流程引擎如何实现会签及会签原理解析

    一.背景 市场上比较有名的开源流程引擎有osworkflow.jbpm.activiti.flowable.camunda.由于jbpm.activiti.flowable这几个流程引擎出现的比较早, ...

  2. php判断客户端浏览器类型

    /** * 判断浏览器名称和版本 */ function get_user_browser() { if (empty($_SERVER['HTTP_USER_AGENT'])) { return ' ...

  3. Mybatis架构原理(二)-二级缓存源码剖析

    Mybatis架构原理(二)-二级缓存源码剖析 二级缓存构建在一级缓存之上,在收到查询请求时,Mybatis首先会查询二级缓存,若二级缓存没有命中,再去查询一级缓存,一级缓存没有,在查询数据库; 二级 ...

  4. freeswitch拨打分机号

    概述 电话语音服务中,有一种稍微复杂的场景,就是总机分机的落地场景,客户拨打总机号码之后,需要再拨打分机号转接到指定的话机. 分机号的拨打一般在总机接通之后,会有语音提示,总机收号之后转接分机. 分机 ...

  5. Whats On Tap | Tapdata Cloud 如何助力大型家居连锁商城推进数字化经营？

    Tapdata Cloud 的操作有多便捷,上手试一下就能充分了解了.--Tapdata Cloud 用户 | 报表实施 @某大型家居服务平台 一边是监管政策趋严,推动房地产回归本源,存量竞争时代开启 ...

  6. 40+倍提升，详解 JuiceFS 元数据备份恢复性能优化之路

    JuiceFS 支持多种元数据存储引擎,且各引擎内部的数据管理格式各有不同.为了便于管理,JuiceFS 自 0.15.2 版本提供了 dump 命令允许将所有元数据以统一格式写入到 JSON 文件进 ...

  7. vlan配置

    VLAN(Virtual Local Area Network)即虚拟局域网,是将一个物理的局域网在逻辑上划分成多个广播域的技术. 通过在交换机上配置VLAN,可以实现在同一个VLAN内的用户可以进行 ...

  8. mybatis-plus详解

    旧的代码生成 记得导包,依赖如下 <!-- mybatis-plus --> <dependency> <groupId>com.baomidou</grou ...

  9. css基础02

    熟练快捷键!方便,要多练!  css复合选择器 不会选孙子,有一个儿子和另一个儿子的孩子(也是孙子)同名了,但子选择器子选择儿子,同名的孙子不选.和后代选择器有一点不一样的. " ,&quo ...

  10. spring实体类（POJO）参数的赋值（form表单）原理

    10.实体类(POJO)参数的赋值(form表单)原理 10.1.原理解析 测试用例 准备好两个实体类 public class Person { private String name; priva ...