首先html为:

<div class="box1"><img src="data:images/more-1.jpg"></div>

1,由于引用的图片可能过大,所以要设置img标签的宽度,其高度等比例增加,css代码为:

.box1{
width:3.8px;
height: 3.8px;
border:1px solid red;
}
.box1 img{
width:2.9px;
border: 1px solid green;
}

浏览器中形成

如果不设置img的宽度,只设置div的宽度,造成的后果是图片显示不全:

div下的img标签中图片的大小设定的更多相关文章

  1. 一段JS控制TD中图片的大小的代码

    一段JS控制TD中图片的大小的代码 <table><tr><td id="otd"><div></div><img ...

  2. ie7下<a></a>标签中<input />时不反应

    <a href="News?id=@dr["id"].CInt()" ><input type="button" valu ...

  3. img标签中alt属性与title属性在seo的作用-摘自网友

    img标签中alt属性与title属性作用,也许大家比较迷惑,现在给大家举例说明.alt属性是图片的替换文字.title属性规定元素的额外信息,有视觉效果. 目录 alt属性 title属性 ie和f ...

  4. Bootstrap轮播(carousel)插件中图片变形的终极解决方案——使用jqthumb.js

    在顶求网的首页中我使用了BootStrap的轮播(carousel)插件来展示文章中的图片.我在程序中自动抓取文章的第一张图片作为该轮播控件中要显示的图片,由于文章的图片大小不一,而轮播插件的大小基本 ...

  5. 在Spring框架中bean配置文件中constructor-arg标签中没有name元素?

    bean配置文件出现错误的依赖: <beans <beans xmlns="http://www.springframework.org/schema/beans"   ...

  6. 10-2 body标签中相关的标签(字体标签,排版标签(div,span),超链接,图片标签)

    一 排版标签(div,span) 1块级标签 <!--div:把标签中的内容作为一个块儿来对待(division).必须单独占据一行.--> <!--div标签的属性:--> ...

  7. CSS实现图片在div a标签中水平垂直居中

    CSS实现图片在div a标签中水平垂直居中 <div class="demo"> <a href="#"> <img src=& ...

  8. css pre如果同时运用了css的border-radius、 overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡

    pre如果同时运用了css的border-radius. overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡. 解决方法:去掉css中border-radius. ...

  9. 利用DIV+CSS制作网页过程中常用的基本概念及标签使

    CSS主要用于对HTML文件功能的补充及扩展,其作用就是对HTML文件中各种排版进行设置,达到对网页中字体.颜色.背景.图片等的控制,使网页能够完全依照设计者的想法来显示. CSS可以控制网页的显示, ...

随机推荐

  1. java.util 集合框架集合

    java的集合框架为程序提供了一种处理对象组的标准方式.设计了一系列标准泛型接口: ⑴Collection ()接口,扩展了Iterable接口,位于集合层次结构的顶部,因此所有的集合都实现Colle ...

  2. java.lang包的分类

    提供利用 Java 编程语言进行程序设计的基础类. 1>  最重要的类是 Object(它是类层次结构的根)和 Class(它的实例表示正在运行的应用程序中的类).   2>  把基本类型 ...

  3. 框架设计——MVC IOC

    主要概念: 注:以下概念是自我理解,不是很准确. IOC:Inversion of Control(控制反转). 本来对象创建是通过使用类内部进行创建,现在把对象创建交给container(容器)管理 ...

  4. Ubuntu 14.10 下sort,uniq,cut,wc命令详解

    sort sort 命令对 File 参数指定的文件中的行排序,并将结果写到标准输出.如果 File 参数指定多个文件,那么 sort 命令将这些文件连接起来,并当作一个文件进行排序. sort语法 ...

  5. 进行以上Java编译的时候,出现unmappable character for encoding GBK。

    public class Exerc02{ public static void main(String args []){ char c = '中国人'; System.out.pingtln(c) ...

  6. php大力力 [005节] php大力力简单计算器001

    2015-08-22 php大力力005. php大力力简单计算器001: 上网看视频,看了半天,敲击代码,如下: <html> <head> <title>简单计 ...

  7. “Compiled” Python files

    To speed up loading modules, Python caches the compiled version of each module in the __pycache__ di ...

  8. linux centos安装编译phantomjs 2.0的方法

    phantomjs 2.0最新版的官方不提供编译好的文件下载,只能自己编译,有教程但是过于简单,特别是服务器上要安装N多的支持.折腾到现在终于装好了并且能正常运行了,截图mark一下: linux c ...

  9. How to set up a basic working Appium test environment

    Appium is a test framework targeting devices; although it is very handy and powerful, it is not so s ...

  10. Net use命令

    以指定账户密码建立网络磁盘 net use s: \\ip\ipc$  "密码" /user:“用户名”