<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>34-背景图片</title>

    <style>

        div{

            width: 500px;

            height: 500px;

        }

        .box1{

            background-image: url(images/girl.jpg);

            /*background-image: url(http://img4.imgtn.bdimg.com/it/u=2278032206,4196312526&fm=21&gp=0.jpg);*/

        }

    </style>

</head>

<body>

<!--

1.如何设置背景图片?

在CSS中有一个叫做background-image: url();的属性, 就是专门用于设置背景图片的

快捷键:

bi background-image: url();

注意点:

1.图片的地址必须放在url()中, 图片的地址可以是本地的地址, 也可以是网络的地址

2.如果图片的大小没有标签的大小大, 那么会自动在水平和垂直方向平铺来填充

3.如果网页上出现了图片, 那么浏览器会再次发送请求获取图片

-->

<div class="box1"></div>

</body>

</html>

H5 34-背景图片的更多相关文章

  1. iOS关于UILabel 基本属性 背景图片 背景色

    [代码] iOS关于UILabel 基本属性 背景图片 背景色 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 ...

  2. Android TextView背景颜色与背景图片设置

    Android TextView 背景颜色与背景图片设置,android textview 控件,android textview 背景, android textview 图片,android te ...

  3. BaseAdapter使listview设置不同背景图片并添加selector

    前段时间为了实现根据item不同的内容实现不同的背景色google了好久只找到了个隔行换色,通过自定义SimpleAdapter终于实现了此功能,但是定义了selector并没有触发点击效果.今天重新 ...

  4. 安卓微信端打开H5页面背景图被键盘挤压移动位置解决

    问题:在微信端(安卓浏览器也如此)打开的H5登录页面中,点击输入信息,弹出软键盘会挤压背景图片. 本来的body宽高设置body{width:100%,height:100%},不起作用,这样写就会导 ...

  5. 盒子总结,文本属性操作,reset操作,高级选择器,高级选择器优先级,边界圆角(了解),a标签的四大伪类,背景图片操作,背景图片之精灵图

    盒子总结 ''' block: 设置宽高 1.没有设置宽,宽自适应父级的宽(子级的border+padding+width=父级的width) 2.没有设置高,高由内容撑开 设置了宽高 一定采用设置的 ...

  6. ThinkPHP5生成二维码图片与另一张背景图片进行合成

    1.PHP方法 public function do_qrcode(){ Vendor('Qrcode.phpqrcode'); Vendor('Qrcode.Compress'); $object ...

  7. uniapp 设置背景图片

    uniapp 由于其特殊机制,导致了背景图片不能引用本地图片.只能通过 转成 base64 来进行设置 附上链接:https://oktools.net/image2base64 图片转成base64 ...

  8. CSS3 background-image背景图片相关介绍

    这里将会介绍如何通过background-image设置背景图片,以及背景图片的平铺.拉伸.偏移.设置大小等操作. 1. 背景图片样式分类 CSS中设置元素背景图片及其背景图片样式的属性主要以下几个: ...

  9. app引导页(背景图片切换加各个页面动画效果)

    前言:不知不觉中又加班到了10点半,整个启动页面做了一天多的时间,一共有三个页面,每个页面都有动画效果,动画效果调试起来麻烦,既要跟ios统一,又要匹配各种不同的手机,然后产品经理还有可能在中途改需求 ...

  10. 在rem布局下使用背景图片以及sprite

    现在移动端页面用rem布局已经是一大流派了,成熟的框架如淘宝的flexiable.js,以及我的好友@墨尘写的更轻量级的hotcss.用rem作单位使得元素能够自适应后,还有一块需要关注的,那就是背景 ...

随机推荐

  1. js验证码实现

    <script language="javascript"> var code; //在全局 定义验证码 function createCode() { //创建验证码 ...

  2. [Hive_8] Hive 设计优化

    0. 说明 在 Hive 中,数据库是一个文件夹,表也是文件夹 partition,是一个字段,是文件 前提:在 Hive 进行 where 子句查询的时候,会将条件语句和全表进行比对,搜索出所需的数 ...

  3. AI学习---分类算法[K-近邻 + 朴素贝叶斯 + 决策树 + 随机森林 ]

    分类算法:对目标值进行分类的算法    1.sklearn转换器(特征工程)和预估器(机器学习)    2.KNN算法(根据邻居确定类别 + 欧氏距离 + k的确定),时间复杂度高,适合小数据    ...

  4. 后台登录(包含验证码)的php代码实现

    login.html文件 <html> <title>login in</title> <body> <form action="han ...

  5. C语言 设一个函数process，调用它时，实现不同功能。

    //凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ 输入a, b,第一次调用process找最大值,第二次调用process找最小值,第三次调用求和. 方法1 ...

  6. 我的第一个SolidWorks图

    1. 学习到的知识点 2. 完成的工程图 3. 感受 学习是一种快乐,学到新的知识要学会分享,只要坚持,就有那么一点点的成就. 4. 参考 SolidWorks帮助文档

  7. 17秋 软件工程 第六次作业 Beta冲刺

    题目:团队作业--Beta冲刺 Scrum Beta Scrum1 Beta Scrum2 Beta Scrum3 Beta Scrum4 Beta Scrum5 总结博客 总结博客

  8. DP 魔族密码 LIS

    题目描述 风之子刚走进他的考场,就…… 花花:当当当当~~偶是魅力女皇——花花!!^^(华丽出场,礼炮,鲜花) 风之子:我呕……(杀死人的眼神)快说题目!否则……-_-### 花花:……咦好冷我们现在 ...

  9. 「AHOI / HNOI2017」单旋

    「AHOI / HNOI2017」单旋 题目链接 H 国是一个热爱写代码的国家,那里的人们很小去学校学习写各种各样的数据结构.伸展树(splay)是一种数据结构,因为代码好写,功能多,效率高,掌握这种 ...

  10. Java学习笔记（三）——封装、继承、多态

    一.封装 概念: 将类的某些信息隐藏在类内部,不允许外部程序直接访问,而是通过该类提供的方法来实现对隐藏信息的操作和访问. 实现步骤: 修改属性的可见性——设为private. 创建getter/se ...