1、当代码为:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
</head>
<body>
<div style="border: solid black;">
<img src="../Website/img/carousel1.jpg">
</div>
</body>
</html>

图片会老实的待在div中。

2、当代码为:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
</head>
<body>
<div style="border: solid black;">
<img src="../Website/img/carousel1.jpg" style="margin-bottom: -10%">
</div>
</body>
</html>

图片会有在底部突出

代码中的约束条件没有,当约束条件充分的时候效果会更明显!

图片根据需要突出div的更多相关文章

  1. Img图片超过了DIV的最大宽度 解决方案

    在该图片所在的div限定一下里边所有的图片的最大长度,这个长度的值可以是div的长度的略小即可. 例如: <div class="content" style="w ...

  2. css background-size与背景图片填满div

    background-size与背景图片填满div 在开发中,常有需要将一张图片作为一个div的背景图片充满div的需求 background-size的取值及解释 background-size共有 ...

  3. css文字居中、图片居中、div居中解决方案

    一.文字居中 若文字只有一行 <!--html代码--> <div class="box"> <p class="text"> ...

  4. 页面布局 ——图片自动按比例显示&&图片随外部div的增大而按比例增大

    图片按比例显示,分为两种情况. 1.空的div内加图片 <div class="emty"><img src="img/my.png"> ...

  5. css文件 如何使背景图片大小适应div的大小

    对背景图片设置属性:background-size:cover;可以实现背景图片适应div的大小. background-size有3个属性: auto:当使用该属性的时候,背景图片将保持100% 的 ...

  6. 设置背景图片的方式(优秀)--把图片放在一个div里面

    优点: 此种情况可以保证图片充满整个windows,即使有扩展显示器也可以 <div id="formbackground" style="position:abs ...

  7. 随机图片大小在DIV中垂直居中对齐总结

    老遇到这种样式 现在总结一下 <!DOCTYPE> <html> <head> <meta http-equiv="Content-Type&quo ...

  8. 设置div背景图片填满div

    可以设置div的样式为 background:url('+UPLOAD_PATH+data.url+') no-repeat; background-size: 100%;width:100%;hei ...

  9. 如何让div中的img图片显示在div下面。

    <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>& ...

随机推荐

  1. nginx 虚拟主机配置

    user nginx; #代表使用的用户 worker_processes auto; #工作衍生进程数,一般代表系统cpu核数一到两倍最好 error_log /var/log/nginx/erro ...

  2. C /C++ 语言练习册

    /************************************** 整数对应 32 bit 二进制数串中数字1的个数 2016-10-24 liukun ***************** ...

  3. 关于js解析的一点小问题

    先来看一下下面的一段代码有什么问题? <html><head><script src="./jquery.min.js"></script ...

  4. 一个c#的输入框函数

    private static string InputBox(string Caption, string Hint, string Default) { Form InputForm = new F ...

  5. Mybatis关联查询和数据库不一致问题分析与解决

    Mybatis关联查询和数据库不一致问题分析与解决 本文的前提是,确定sql语句没有问题,确定在数据库中使用sql和项目中结果不一致. 在使用SpringMVC+Mybatis做多表关联时候,发现也不 ...

  6. 比较.NET程序集(DLL或EXE)是否相同

    如何比较两个.NET程序集(DLL或EXE)是否相同呢? 直接比较文件内容?当然没那么简单了,这个你可以去试试,去比较一下两次Build产生的程序集, 就算内容没有改变,产生的程序集的二进制文件也是不 ...

  7. MS SQL SERVER导出表结构到Excel

    通过sql语句导出表结构 SELECT 表名 Then D.name Else '' End, 表说明 Then isnull(F.value,'') Else '' End, 字段序号 = A.co ...

  8. .net的一致性哈希实现

    最近在项目的微服务架构推进过程中,一个新的服务需要动态伸缩的弹性部署,所有容器化示例组成一个大的工作集群,以分布式处理的方式来完成一项工作,在集群中所有节点的任务分配过程中,由于集群工作节点需要动态增 ...

  9. Android换肤技术总结

    原文出处: http://blog.zhaiyifan.cn/2015/09/10/Android%E6%8D%A2%E8%82%A4%E6%8A%80%E6%9C%AF%E6%80%BB%E7%BB ...

  10. POJ 3422 Kaka's Matrix Travels

    Kaka's Matrix Travels Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 9567   Accepted:  ...