图片根据需要突出div
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的更多相关文章
- Img图片超过了DIV的最大宽度 解决方案
在该图片所在的div限定一下里边所有的图片的最大长度,这个长度的值可以是div的长度的略小即可. 例如: <div class="content" style="w ...
- css background-size与背景图片填满div
background-size与背景图片填满div 在开发中,常有需要将一张图片作为一个div的背景图片充满div的需求 background-size的取值及解释 background-size共有 ...
- css文字居中、图片居中、div居中解决方案
一.文字居中 若文字只有一行 <!--html代码--> <div class="box"> <p class="text"> ...
- 页面布局 ——图片自动按比例显示&&图片随外部div的增大而按比例增大
图片按比例显示,分为两种情况. 1.空的div内加图片 <div class="emty"><img src="img/my.png"> ...
- css文件 如何使背景图片大小适应div的大小
对背景图片设置属性:background-size:cover;可以实现背景图片适应div的大小. background-size有3个属性: auto:当使用该属性的时候,背景图片将保持100% 的 ...
- 设置背景图片的方式（优秀）--把图片放在一个div里面
优点: 此种情况可以保证图片充满整个windows,即使有扩展显示器也可以 <div id="formbackground" style="position:abs ...
- 随机图片大小在DIV中垂直居中对齐总结
老遇到这种样式 现在总结一下 <!DOCTYPE> <html> <head> <meta http-equiv="Content-Type&quo ...
- 设置div背景图片填满div
可以设置div的样式为 background:url('+UPLOAD_PATH+data.url+') no-repeat; background-size: 100%;width:100%;hei ...
- 如何让div中的img图片显示在div下面。
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>& ...
随机推荐
- Android样式和主题
样式:style--> 主题:theme--> <style name="my_style"> <item name="android:te ...
- Ceph RGW服务 使用s3 java sdk 分片文件上传API 报‘SignatureDoesNotMatch’ 异常的定位及规避方案
import java.io.File; import com.amazonaws.AmazonClientException; import com.amazonaws.auth.profile ...
- 使用AccessibilityService执行开机自启动
res/xml/accessibility_service_config.xml <accessibility-service xmlns:android="http://schema ...
- C#-WebForm-Repeater-重复器
Repeater-重复器 - 类似WinForm中的ListView,用列表来展示数据 格式: <body> <form id="form1" runat=&qu ...
- 进度条投票-W
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- html页面制作css基本设置
html{ height: 100%;} *{ margin: 0; padding: 0;}/* tell the browser to render HTML 5 elements as bloc ...
- bzoj2330: [SCOI2011]糖果
2330: [SCOI2011]糖果 Time Limit: 10 Sec Memory Limit: 128 MB Description 幼儿园里有N个小朋友,lxhgww老师现在想要给这些小朋友 ...
- HDU 1796How many integers can you find（容斥原理）
How many integers can you find Time Limit:5000MS Memory Limit:32768KB 64bit IO Format:%I64d ...
- JQuery------分页插件下载地址
转载GitHub: https://github.com/pgkk/kkpager
- ASP.NET MVC移动M站建设-使用51Degree 移动设备的识别
上一篇,介绍了移动M站的建设.说的很简单.觉得好像也没把M站给讲清楚.估计是对移动M站 认识还不够深刻吧.这里,在讲一讲51Degree 这个组件. 51degrees 号称是目前最快.最准确的设备检 ...