CSS 背景图片设置：

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

    <title></title>

    <script src="js/mui.min.js"></script>

    <link href="css/mui.min.css" rel="stylesheet"/>

    <script type="text/javascript" charset="utf-8">

          mui.init();

    </script>

    <style>

        .container{

            background-image:url(img/view_002.jpg);　

            width:100%;

            height:300px;

            line-height: 300px;

            text-align: center;

        }

    </style>

</head>

<body>

    <div class="container"></div>

</body>

</html>

上述代码为一个类名为 container 的 DIV 插入了一张背景图片，效果如下：

原图：

网页效果图：

为背景图片设置样式，使之更美观：

            /* 图片自适应大小 */

            /*background-size: 100% 100%;*/ 

            /* 图片居中 */

            background-position: center;

            /* 背景填充  */

            background-size: cover;

            /*背景模糊*/

            -webkit-filter: blur(2px);

        }

CSS 常用 background 设置的更多相关文章

  1. css常用样式背景background如何使用

    css背景background属性常用于定义HTML的背景,background简写属性作用是将背景属性设置在一个声明中,background背景属性常见为以下这些:.background-color ...

  2. [Web 前端] 010 css 常用的边框设置

    css 常用边框属性 概览 参数 释义 border u设置边框属性(可以多个) border-color 边框颜色 border-style 边框样式solid 实线,dotted 点状线,dash ...

  3. CSS背景background、background-position使用详解

    背景(background)是css中一个重要的的部分,也是需要知道的css的基础知识之一.这篇文章将会涉及css背景(background)的基本用法,包括诸如 background-attachm ...

  4. CSS背景background详解，background-position详解

    背景(background)是css中一个重要的的部分,也是需要知道的css的基础知识之一.这篇文章将会涉及css背景(background)的基本用法,包括诸如 background-attachm ...

  5. CSS常用样式及示例

    CSS常用样式及示例 一.简介      层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集) ...

  6. CSS常用标签

    CSS常用标签 一 CSS文字属性 color : #999999; /*文字颜色*/ font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; / ...

  7. DIV+CSS常用网页布局技巧！

    以下是我整理的DIV+CSS常用网页布局技巧,仅供学习与参考! 第一种布局:左边固定宽度,右边自适应宽度 HTML Markup <div id="left">Left ...

  8. CSS常用样式属性

    1.CSS字体和文本相关属性 属性 font-family 规定文本的字体系列,比如:“serif” ''sans-serif" font-size 规定文本的字体尺寸 font-style ...

  9. CSS 常用语法与盒模型分析

    CSS基础知识 CSS规则由两个主要的部分构成:选择器,以及一条或者多条声明 selector { property: value; property: value; ... property: va ...

随机推荐

  1. 折腾了我两天的springboot数据源datasource循环依赖问题，都被搞疯掉了

    在做项目重构的时候增加了两个功能 1.多数据源. 2.token的验证从以前的数据库验证,移到了redis端. 1.多数据源使用 druid-spring-boot-starter 套件 其核心代码如 ...

  2. java三大特性：封装、继承、多态

    Java三大特性之封装   一.定义 封装性指的是将对象的状态信息隐藏在对象内部,不允许外部程序直接访问对象内部的信息,而是通过该类所提供的方法来实现对内部信息的操作和访问. 二.使用封装的好处: 1 ...

  3. C++卷积神经网络实例：tiny_cnn代码具体解释（8）——partial_connected_layer层结构类分析（上）

    在之前的博文中我们已经将顶层的网络结构都介绍完毕,包括卷积层.下採样层.全连接层,在这篇博文中主要有两个任务.一是总体贯通一下卷积神经网络在对图像进行卷积处理的整个流程,二是继续我们的类分析.这次须要 ...

  4. C++——多态性实现机制

    C++的多态性实现机制剖析 1. 多态性和虚函数 #include <iostream.h> class animal { public: void sleep() { cout<& ...

  5. 再谈ITFriend网站的定位

    在网站开发阶段.内部测试阶段.公开测试阶段,让诸多好友和网友,参与了我们的网站ITFriend的体验和测试.其中,大家非常关心,我们的网站是干什么的.在我们不做任何解释的情况下,有的网站认为ITFri ...

  6. POS 60域用法

    版权声明:本文为博主原创文章,未经博主允许不得转载. 自定义域(Reserved Private) 1.变量属性 N...17(LLLVAR),3个字节的长度值+最大17个字节的数字字符域. 压缩时用 ...

  7. 我的MFC/C++学习笔记 http://blog.bccn.net/CrystalFan/6909

    2009.07.31 ------------------------------------------------------------------------------------ No.1 ...

  8. HDU 1010 Tempter of the Bone (ZOJ 2110) DFS+剪枝

    传送门: HDU:http://acm.hdu.edu.cn/showproblem.php?pid=1010 ZOJ:http://acm.zju.edu.cn/onlinejudge/showPr ...

  9. java之Thread.sleep(long)与object.wait()/object.wait(long)的区别及相关概念梳理（good）

    一.Thread.sleep(long)与object.wait()/object.wait(long)的区别sleep(long)与wait()/wait(long)行为上有些类似,主要区别如下:1 ...

  10. 【u223】放牙刷

    [题目链接]: [题解] 错排公式 f[n] = (n-1)*(f[n-1]+f[n-2]); 这样理解: 要从n-1和n-2递推到n; 假设第n个位置上的数要放在前n-1个位置中的k位置;则有n-1 ...