img {
max-width: 800px;
height: auto;
}

代码中的max-width:800px限制图片的最大宽度为800像素,而下面的hight:auto很关键,可以保证图片有正确的长宽比,不至于因为被调整宽度而变形。

实用例子(未经测试————————————————————)
  WordPress自动调整图片大小
  1、打开你的“样式表 (style.css)”文件,然后在 p img{ 或类似的地方添加下列代码(可以将所有550改成你想要的宽度)
代码如下
p img{
max-width: 550px;
width: expression(this.width > 550 ? "550px" : true);
height: auto;
}
这里是我实际中用到的一个设置样式
<style type="text/css">
#content img{max-width: 250px; height: auto; }
</style>

CSS自动控制图片大小的代码的更多相关文章

  1. 用CSS控制图片大小显示的方法

    图片自动适应大小是一个非常常用的功能,在进行制作的时候为了防止图片撑开容器而对图片的尺寸进行必要的控制,我们可不可以用CSS控制图片使它自适应大小呢? 可以通过按比例缩小或者放大到某尺寸(自己指定), ...

  2. CSS控制图片大小

    转载请注明来源:https://www.cnblogs.com/hookjc/ 1.CSS控制背景图片:    对于一个网页,我们开始设计的时候,可能没有过多的去想背景图到底是什么,因为大多都是设计背 ...

  3. css限制图片大小,避免页面撑爆

    /*==========限制图片大小======避免页面撑暴========*/img { max-width:100%;width:expression(width>669?"100 ...

  4. CSS强制图片大小

    相信大家做网页时经常会碰到大分辨率的图片会把表格涨破以致漂亮的网页面目全非,但只要使用以下的CSS语句即可解决. 该CSS的功能是:大于600的图片自动调整为600显示. <style type ...

  5. div+css+jQuery图片横向滚动代码(带左右点击按钮)

    首先感谢Blue老师的javascript教程,给了我很多的启发,这是我在看完10 - 定时器的使用 - 2这节视频后,自己试着用jQuery重新改写了一下代码,感觉至少比百度搜出来的那一坨靠谱多了, ...

  6. 实现图片大小的自动控制( 图片大小控制CSS代码)

    图片大小控制CSS代码 将以下代码放到你的样式表文件中即可实现图片大小的自动控制. /*图片大小控制CSS By Tekin */img,a img{border:0;margin:0;padding ...

  7. mui-图文列表 图片大小问题

    下面是源码,不能调节图片大小 <ul class="mui-table-view"> <li class="mui-table-view-cell mu ...

  8. FE: CSS固定图片显示大小及GitHub Pages在线演示

    CSS固定图片显示大小 分析 假设图片区域的大小固定为250×300px,那么我们可以写出如下的样式 .picture-area { width: 250px; height: 300px; marg ...

  9. Css Sprite 图片等比缩放图片大小

    图片大小80*40,即每张图片大小40*40,如何以20*20显示图片?1. 首先看下如何以40*40显示第二张图片: 正常显示css代码 .sprite { background-image: ur ...

随机推荐

  1. 在网页中插入CSS样式表的几种方法

    1. 链入外部样式表 链入外部样式表是把样式表保存为一个样式表文件,然后在页面中用<link>标记链接到这个样式表文件,这个<link>标记必须放到页面的<head> ...

  2. 在Azure中使用Load Runner测试TCP最大并发连接数

    对于Azure中的每一台虚机,它所能支持的TCP最大并发连接数是50万(参考微软官网: http://azure.microsoft.com/en-us/documentation/articles/ ...

  3. 外部exe窗体嵌入winform

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Drawing; u ...

  4. Linux下安装搜狗输入法

    目前的搜狗输入法 for Linux 是Linux Deepin 社区版的测试版,基于Fcitx 框架. 话不多说,直接上. 准备工作:卸载Ubuntu默认的ibus输入法: sudo apt-get ...

  5. Microsoft SQL Server 2008 安装图解(Windows 7)

    简介 本文详细记录了一次完整的Microsoft SQL Server 2008在Windows 7操作系统上的安装过程.注意:Microsoft SQL Server 2008与Windows 7操 ...

  6. Linux内核学习笔记1——系统调用原理【转】

    1什么是系统调用 系统调用,顾名思义,说的是操作系统提供给用户程序调用的一组“特殊”接口.用户程序可以通过这组“特殊”接口来获得操作系统内核提供的服务,比如用户可以通过文件系统相关的调用请求系统打开文 ...

  7. Android项目开发全程(四)-- 将网络返回的json字符串轻松转换成listview列表

    前面几篇博文介绍了从项目搭建到获取网络字符串,对一个项目的前期整体工作进行了详细的介绍,本篇接着上篇介绍一下怎么样优雅将网络返回的json字符串轻松转换成listview列表. 先上图,看一下效果. ...

  8. HW4.20

    public class Solution { public static void main(String[] args) { boolean isPrime = true; int count = ...

  9. Using Java SecurityManager to grant/deny access to system functions

    In Java it is possible to restrict access to specific functions like reading/writing files and syste ...

  10. 博客搬家到CSDN:http://blog.csdn.net/yeweiouyang

    博客搬家到CSDN:http://blog.csdn.net/yeweiouyang