CSS强制图片大小
相信大家做网页时经常会碰到大分辨率的图片会把表格涨破以致漂亮的网页面目全非,但只要使用以下的CSS语句即可解决。
该CSS的功能是:大于600的图片自动调整为600显示。
<style type="text/css">
<!--
img {width:expression(this.width>600?"600px":this.width+"px");}
}
-->
</style>
上面的代码在使用的过程中发现第一次打开页面时图片会缩到很小,需要刷新页面才能实达所设置的大小,故又找到了以下代码:
img{
max-height:720px;
max-width:640px;
width:expression(this.width > 640 && this.height < this.width ? 640: true);
height:expression(this.height > 720 ? 720: true);
}
经测试是可以解决图片自适应大小的问题了。
另一种方法是让图片自适应DIV及table的大小:
先定义一个JAVA函数
<script type="text/javascript" >
function ReImgSize(){
for (j=0;j<document.images.length;j++)
{
document.images[j].width=(document.images[j].width>420)?"420":document.images[j].width;
}
}
</script>
然后在body区域加上onload="ReImgSize()" 就可以了。
顺道说一下:
Mozilla支持一个max-width 的CSS语法。于是我们这样这样定义图片的全局样式。
img{
max-width:100%;height:auto;
}
这样图片就回在div或table内自动适应其大小了.
CSS强制图片大小的更多相关文章
- CSS自动控制图片大小的代码
img { max-width: 800px; height: auto; } 代码中的max-width:800px限制图片的最大宽度为800像素,而下面的hight:auto很关键,可以保证图片有 ...
- 用CSS控制图片大小显示的方法
图片自动适应大小是一个非常常用的功能,在进行制作的时候为了防止图片撑开容器而对图片的尺寸进行必要的控制,我们可不可以用CSS控制图片使它自适应大小呢? 可以通过按比例缩小或者放大到某尺寸(自己指定), ...
- CSS控制图片大小
转载请注明来源:https://www.cnblogs.com/hookjc/ 1.CSS控制背景图片: 对于一个网页,我们开始设计的时候,可能没有过多的去想背景图到底是什么,因为大多都是设计背 ...
- css限制图片大小,避免页面撑爆
/*==========限制图片大小======避免页面撑暴========*/img { max-width:100%;width:expression(width>669?"100 ...
- mui-图文列表 图片大小问题
下面是源码,不能调节图片大小 <ul class="mui-table-view"> <li class="mui-table-view-cell mu ...
- 实现图片大小的自动控制( 图片大小控制CSS代码)
图片大小控制CSS代码 将以下代码放到你的样式表文件中即可实现图片大小的自动控制. /*图片大小控制CSS By Tekin */img,a img{border:0;margin:0;padding ...
- FE: CSS固定图片显示大小及GitHub Pages在线演示
CSS固定图片显示大小 分析 假设图片区域的大小固定为250×300px,那么我们可以写出如下的样式 .picture-area { width: 250px; height: 300px; marg ...
- Css Sprite 图片等比缩放图片大小
图片大小80*40,即每张图片大小40*40,如何以20*20显示图片?1. 首先看下如何以40*40显示第二张图片: 正常显示css代码 .sprite { background-image: ur ...
- div css 伪类 不固定图片大小 居中, css div 实现三角形
div css 伪类 不固定图片大小 居中 <style> .pic_box{width:300px; height:300px; background-color:#beceeb; fo ...
随机推荐
- Documentation/sched-bwc.txt 的中文翻译
Chinese translated version of Documentation/sched-bwc.txt If you have any comment or update to the c ...
- Putty工具包简单使用
Putty工具包简单使用 一.Putty简介 Putty是一款远程登录工具,用它可以非常方便的登录到Linux服务器上进行各种操作(命令行方式).Putty完全免费,而且无需安装(双击即可运行),支持 ...
- Table Lookup
做OJ的时候,做过类似的,即hash.算法很简单,关键是书上写的和做OJ,是完全不同的风格.有很多值得学习的地方. /* * Table Lookup * 详见<<C程序设计语言>& ...
- 【转】(DT系列二)device tree的书写规范
原文网址:http://www.cnblogs.com/biglucky/p/4057478.html devicetree的书写规范 下面从节点,属性,reg,ranges,中断控制器等几个方面叙述 ...
- 【转】HashMap和HashSet的区别
原文网址:http://www.importnew.com/6931.html HashMap和HashSet的区别是Java面试中最常被问到的问题.如果没有涉及到Collection框架以及多线程的 ...
- javascript正则表达式(一)——语法
前言 js中类RegExp类表示正则表达式,具有强大的模式匹配.文本检索和替换功能.正则表达式的模式规则是由一个字符序列组成,包括所有字母和数字在内,大多数的字符都是按照直接量匹配字符,某些特殊字符并 ...
- http 400 错误的请求怎么解决
HTTP400是个错误的统称 你将IE选项-高级中的显示HTTP友好错误信息前面的勾去掉. 然后在开这个页,,把错误代码复制出来 .其实有时是网页本身已经不可用了,你先关掉浏览器稍等一会再登陆网页也是 ...
- C#编译时出现“不安全代码只会在使用 /unsafe 编译的情况下出现”错误的解决
原因是:在编译的代码里面有不安全类型unsafe方法或类!解决方法:将项目属性页中生成下的“允许不安全代码”复选框打上对勾即可,方法如下:项目属性对话框->生成->允许不安全代码块 选中即 ...
- Mustache.js语法学习笔记
原文地址:http://www.cnblogs.com/flypig88/archive/2012/05/14/2497780.html 看了Mustache的github,学学其中的语法,做个笔记 ...
- King's Quest - poj 1904(强连通分量+外挂输入输出)
题意:国王有N个儿子,每个儿子都有很多喜欢的姑娘,官员为每个王子都找了一个姑娘让他们结婚,不过国王不满意,他想知道他的每个儿子都可以和那个姑娘结婚(前提他的儿子必须喜欢那个姑娘) 分析:因为最下面一行 ...