一般图片打的水印都是固定宽高，这样会在原图尺寸过大或者过小的情况，打上去的水印太渺小，或者占去太多面积。因此比较好的方法是根据原图宽高，动态调整水印图尺寸，保持和原图大小相匹配，即你大我也大，你小我也小。 代码逻辑包含三点： 定一个水印尺寸比例。 根据原图宽高x比例，得到新的水印宽高 ...

意思是图片能百分百显示在容器里，这个容器可以是table的td,也可以是DIV。以下用div做容器来说明。图片随页面的变化而变化，那么最好把div的宽度设置成百分比，而不是像素，这样div就不会被固定大小，从而能自适应页面的大小。<div style=" width="x%"> < ...

怎样实现响应式布局？ 对于这个问题，我们可以通过CSS3中的Media Query来实现，即媒介查询。媒体查询让CSS可以更精确作用于不同的媒体类型和同一媒体的不同条件。媒体查询的大部分媒体特性都接受min和max用于表达"大于或等于"和"小与或等于"。如：width会有min-width ...

1、从上图知道原始图片大小是 800 * 250，即宽高比为 3.2； 2、html 及 css 代码如下， 　　可以知道就只是在一个div里面放了一张图片，那么如何让这张图片的宽高比固定呢，看了css之后就知道了原来是神奇的padding帮了我们的忙。 3、当img的宽度为100 ...

我们在写页面的时候经常会遇到需要图片自适应容器大小这样的情况，下面我就开门见山的说明一下怎样去实现这样一个效果。 1.简单的做法 1 2 3 ...

摘自：https://blog.csdn.net/u010513603/article/details/78200207 1、方案一：CSS3 vw 单位 CSS3 中新增了一组相对于可视区域百分比的长度单位vw、vh、vmin、vmax。其中vw是相对于视口宽度百分比的单位，1vw ...

...

需求：1.父级div不设置高度 　　　2.图片高度自适应，并且显示为正方形； 以前遇到列表中图片高度必须和父级宽度相同，并且需要为正方形的时候，最开始的方法是定死图片高度，这样会导致不同分辨率下图片会压缩，后来傻傻的用js来控制图片的高度，直到现在才明白几句css就能搞定，并且完全符合 ...