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. Redis 性能測试

    Redis 性能測试 Redis 性能測试是通过同一时候运行多个命令实现的. 语法 redis 性能測试的基本命令例如以下: redis-benchmark [option] [option valu ...

  2. 【例题 6-6 UVA - 679】Dropping Balls

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 直接模拟会超时. 根据奇偶的规律.直接判断会往哪里走就好. 每个二叉树的节点.必然是左边和右边走的次数对半分.->奇数左边多一 ...

  3. FPGA实现UHS的一些资料

    对使用FPGA和SD卡进行UHS模式通信的评估: 论文:基于FPGA的SD UHS-II卡控制器设计与实现 设计IP:SD UHS-II Host Controller 供应商: System Lev ...

  4. Python代码优化及技巧笔记（一）

    前言 这里是记录一些本人在开发过程中遇到的一些细节问题.与君共勉. 版权说明 著作权归作者全部.商业转载请联系作者获得授权,非商业转载请注明出处. 作者:Coding-Naga链接:http://bl ...

  5. JAVA日志库2

    一.常用日志Jar关系 2015第30周四Java日志组件 接口:将所有日志实现适配到了一起,用统一的接口调用. 实现:目前主流的日志实现 旧日志到slf4j的适配器:如果使用了slf4j,但是只想用 ...

  6. RDA安装

    解压到/home/oracle下面     $ cp /home/oracle/rda $ perl rda.pl -cv   运行上面的命令,如果最后一行出现下面所示,说明没问题       No ...

  7. 23种设计模式——Prototype模式

    Prototype模式是提供自我复制的功能.包括浅拷贝和深拷贝. 一.Prototype模式的用途 场景1:游戏场景中有很多类似的敌人,它们的技能都一样,但是随着敌人出现的位置和不同,它们的能力也不太 ...

  8. php.ini 修改上传文件的限制

    打开php.ini,首先找到file_uploads = on ;是否允许通过HTTP上传文件的开关.默认为ON即是开upload_tmp_dir ;文件上传至服务器上存储临时文件的地方,如果没指定就 ...

  9. Windows10终端优化方案：Ubuntu子系统+cmder+oh-my-zsh

    原问地址:https://zhuanlan.zhihu.com/p/34152045 最近从MacBook换到了种草已久的Surface Book 2,而我的工作环境也自然要从macOS换到Windo ...

  10. ios开发网络学八：NSURLSession相关代理方法

    #import "ViewController.h" @interface ViewController ()<NSURLSessionDataDelegate> /* ...