首先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. hive 中 union all

    hive 中的union all是不能在sql语句的第一层使用的,否则会报 Top level UNION is not supported currently 错误: 例如如下的方式: select ...

  2. MongoDB索引、聚合

    用$where可以执行任意的js作为查询的一部分. db.foo.find({"$where" : function(){          for(var current in ...

  3. oracle疑难杂症问题

    在虚拟机中安装了oracle10g,由于虚拟机的空间有限,看到磁盘空间快没了,就手贱把oracle目录中的空文件夹(E:\oracle\product\10.2.0\flash_recovery_ar ...

  4. 文件夹差异文件对比工具 meld

    /***************************************************************************************** * 文件夹差异文件 ...

  5. hdu 5190 Building Blocks

    问题描述 看完电影后,乐乐回家玩起了积木. 他已经搭好了n堆积木,他想通过调整积木,使得其中有连续W堆积木具有相同的高度,同时他希望高度恰好为H. 乐乐的积木都这了,也就是说不能添加新的积木,只能移动 ...

  6. scrollView滚动(通过代码)

    平时的开发中可能会要求scrollview滚动,一般的方法时通过scrollview.scrollto(0,1000);来实现,但是注意这个方法是在scrollview停止动画之后才能执行的,因为如果 ...

  7. jquery 下了框

    //选中特定值 $("#Select_GBType").attr("value", "选中项ID"); //获取选中项的值 $(" ...

  8. linux shell 逻辑运算符、逻辑表达式详解

    shell的逻辑运算符 涉及有以下几种类型,因此只要适当选择,可以解决我们很多复杂的判断,达到事半功倍效果. 一.逻辑运算符 逻辑卷标 表示意思 1. 关于档案与目录的侦测逻辑卷标! -f 常用!侦测 ...

  9. Android高效加载大图,多图解决方案,有效避免程序OOM异常

    收藏自:http://blog.csdn.net/guolin_blog/article/details/9316683 谷歌官方文档:http://developer.android.com/tra ...

  10. rsync 使用示例

    导读 Rsync(remote sync) 是用于同步某一位置文件和目录到另一位置的有效方法.备份的位置可以在本地服务器或远程服务器.本站之前亦有介绍rsync的安装配置和教程,详看<rsync ...