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. 基于bootstrap的主流框架有哪些

    基于bootstrap的主流框架有哪些 一.总结 一句话总结:其实可以直接百度bootstrap后台模板,出来一大堆,想用哪个用哪个. 二.[前端框架系列]浅谈当前基于bootstrap框架的几种主流 ...

  2. js的继承操作案例

    js的继承操作案例 一.总结 1.要案例要求,内心中想出操作要点 二.js的继承操作案例 案例 练习1:具有默认值的构造函数 实例描述: 有时候在创建对象时候,我们希望某些属性具有默认值 案例思路: ...

  3. UVA 10917 Walk Through the Forest SPFA

    uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem&problem= ...

  4. UVA 11859 - Division Game

    看题传送门 题目大意 有一个n * m的矩阵,每个元素均为2~10000之间的正整数,两个游戏者轮流操作.每次可选一行中的1个或者多个大于1的整数把它们中的每个数都变成它的某个真因子,比如12可以变成 ...

  5. [Nuxt] Build a Navigation Component in Vue.js and Use in a Nuxt Layout

    You can isolate parts of templates you want to re-use into components, but you can also reuse those ...

  6. [TypeScript] Sharing Class Behavior with Inheritance in TypeScript

    Typescript classes make inheritance much easier to write and understand. In this lesson we look into ...

  7. Android学习笔记之GridView的使用具体解释

    (1)创建布局代码例如以下: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android&quo ...

  8. 怎样cp文件夹时忽略指定的文件夹和文件

    在备份ltedecoder程序时,须要把此文件夹拷由到bak文件夹下.但decoder文件夹下有个大文件,不须要备份,还有日志问题,也不须要备份,怎样实现呢?? 方法: cd /source-dir ...

  9. Win或Linux中编译安装软件的命令解析： configure; make; make install

    原文地址:http://www.cnblogs.com/Jerry-Chou/archive/2010/12/18/1909843.html 翻译一篇文章,我最早从这篇文章中了解到为什么Linux平台 ...

  10. MyCAT分表初体验

    1.mycat二进制包安装 下载地址:http://dl.mycat.io/ tar -zxvf Mycat-server-1.6.5-release-20180122220033-linux.tar ...