1. img插入图片,用的最多,比如产品展示类

.section img {
width: 200px;/* 插入图片更改大小 width 和 height */
height: 210px;
margin-top: 30px; /* 插入图片更改位置 可以用margin 或padding 盒模型 */
margin-left: 50px; /* 插入当图片也是一个盒子 */
}

2. 背景图片一般用于小图标背景或者超大背景图片

.aside {
width: 400px;
height: 400px;
border: 1px solid purple;
background: #fff url(images/sun.jpg) no-repeat; background-size: 200px 210px; /* 背景图片更改大小只能用 background-size */
background-position: 30px 50px; /* 背景图片更该位置 用 background-position */
}

CSS - 插入图片img和背景图片的更多相关文章

  1. CSS之生成全屏背景图片

    在CSS中背景图片的填充方法: background-position:x,y(背景图片x,y轴的定位) background-repeat:no-repeat(不平铺) background-rep ...

  2. CSS再学习 之背景色 背景图片

    背景色 p {background-color: gray;} 如果您希望背景色从元素中的文本向外少有延伸,只需增加一些内边距. p {background-color: gray; padding: ...

  3. php 合并图片 (将活动背景图片和动态二维码图片合成一张图片)

    <?php //案例一:将活动背景图片和动态二维码图片合成一张图片 //图片一 $path_1 = './background.png'; //图片二 $path_2 = './FU0851_2 ...

  4. css里面如何设置body背景图片满屏

    @{    Layout = null;    ViewBag.Title = "Login Page";} <!DOCTYPE html> <html>& ...

  5. CSS背景图片常见属性设置

    在CSS中,图片属性的设置是必不可少的,下面介绍一下常见的图片属性: 1)背景图片插入:background-image:url(位置及名称);  //默认在父级元素内的左上角 2)背景平铺方式:ba ...

  6. CSS 背景图片的定位和缩放

    在 CSS 中,利用 background-image 属性我们可以指定元素的背景图片,例如: .example { background-image: url(image/some.png); ba ...

  7. 不用css样式表和背景图片实现圆角矩形,超简洁!

    当网站页面的整体布局设计好后,接下来有很多细节的实现是很让人头疼的.其中之一就是圆角矩形的实现. 在网上看了很多圆角矩形的实现方法,基本有两种,一种是用纯css实现,不需要背景图片:另一种是用背景图像 ...

  8. CSS背景图片

    1.背景图片插入 代码格式:background-image:url(): 括号内填写图片路径 2.背景图片设置大小 代码格式:background-size:宽.高 3.背景图片设置不平铺 代码格式 ...

  9. CSS background-image背景图片相关介绍

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

随机推荐

  1. 如何在centos里面安装php-posix

    今天在虚拟机上安装一个系统的插件,出现了You must have POSIX and PCNTL functions to use Video Process,搜了一下缺少插件,那接下来就是安装了. ...

  2. 树莓派安装raspbian并配置开发环境

    1.烧录系统 首先准备好我们要烧录的raspbian系统,可以在树莓派官网中下载https://www.raspberrypi.org/downloads/ 这里我们选择 2018-11-13-ras ...

  3. TensorFlow:谷歌图像识别网络inception-v3下载与查看结构

    学习博客: # https://www.cnblogs.com/felixwang2/p/9190731.html # https://www.cnblogs.com/felixwang2/p/919 ...

  4. 微服务架构中的Redis

    了解如何将Redis与Spring Cloud和Spring Data一起使用以提供配置服务器,消息代理和数据库. Redis可以广泛用于微服务架构中.它可能是少数流行的软件解决方案之一,你的应用程序 ...

  5. 基础_04_list and tuple

    一.list(列表) list是Python里的一种容器,里面可以存储多个任何类型的数据,长度也可以任意伸缩,可以像C语言中数组那样,按照索引下标获取对应的值.但数组是一个存储多个固定类型变量的连续内 ...

  6. python opencv:使用鼠标当做画笔

    鼠标事件 import cv2 events=[i for i in dir(cv2) if 'EVENT'in i] print events 双击画圆圈 import cv2 import num ...

  7. 通过python调用jenkins 常用api操作

    # -*- coding: utf-8 -*- import jenkins class TestJenkins(object): def __new__(cls, *args, **kwargs): ...

  8. 关于数据库中的三值逻辑(Tree-Value-Logic)

    在sql中,逻辑表达式(也叫做谓词),可以有三种值:True.False.Unknown,这就是所谓的三值逻辑,,是sql的特有属性. 在大多数编程语言中,逻辑表达式只有两个值,就是True和Fals ...

  9. Tomcat线程池及性能优化(重点)

    只需安装Tomcat [root@localhost ~]# vim /usr/local/tomcat8/conf/server.xml 修改处如下: <Connector port=&quo ...

  10. php 算法知识 猴子选大王

    一群猴子排成一圈,按1,2,...,n依次编号. 然后从第1只开始数,数到第m只,把它踢出圈, 从它后面再开始数,再数到第m只,在把它踢出去..., 如此不停的进行下去,直到最后只剩下一只猴子为止,那 ...