<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>css2.0 VS ie</title>
<style type="text/css">
<!--
body {
font-size: 12px;
text-align: center;
margin: 0px;
padding: 0px;
}
#pic{
margin:0 auto;
width:800px;
padding:0;
border:1px solid #333;
}
#pic img{
max-width:780px;
width:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" );
border:1px dashed #000;
}
-->
</style>
</head>
<body>
<div id="pic">
<img src="/articleimg/2006/03/3297/koreaad_10020.jpg" alt="感谢blueidea被我盗链图片!"/>
</div>
</body>
</html>
分享到:
相关推荐
在网页设计中,让图片在div容器中自适应显示是一个常见的需求。这涉及到CSS样式、JavaScript以及浏览器兼容性的问题。本文将深入探讨如何利用纯JavaScript实现img图片在大小未知的div内自适应显示,并兼容不同浏览器...
### div背景全屏自适应知识点解析 #### 一、知识点概述 在网页设计与开发过程中,经常需要将某个`div`元素的背景设置为全屏显示,并且能够根据不同的屏幕尺寸进行自适应调整。这种技术被称为“div背景全屏自适应”...
在网页设计中,"div宽度自适应布局(左边自适应)"是一种常见的网页布局技术,它主要应用于响应式设计,使得页面在不同设备和屏幕尺寸下都能保持良好的视觉效果。这种布局方式强调左侧内容的宽度根据浏览器窗口大小...
在网页设计中,图片自适应是一项重要的技术,它允许图片根据浏览器窗口的大小或设备的屏幕尺寸自动调整显示比例,确保用户体验的优化。对于IE8这样的老版本浏览器,由于其对现代CSS3属性的支持有限,实现图片自适应...
在网页设计中,图片自适应大小是一个常见的需求,特别是在响应式布局中,为了确保不同设备和屏幕尺寸下的视觉效果,我们需要让图片能够根据其容器(如div)的大小自动调整。本文将详细介绍如何使用纯JavaScript实现...
### Jquery 图片自适应大小并居中 在前端开发中,经常遇到的一个问题是当页面中的图片尺寸不统一,特别是当图片的比例与显示区域的比例不匹配时,如何使得图片能够自适应显示区域,并且保持原有比例不变形。本文将...
针对给定文件提供的内容,我们将详细探讨在HTML中使用CSS实现图片自适应手机屏幕大小的方法。以下内容将涵盖相关的知识点,包括CSS属性、选择器、以及与响应式设计相关的概念。 首先,我们注意到文件中提供了一段...
Div即父容器不根据内容自适应高度,我们看下面的代码: 复制代码代码如下: <div id=”main”> <div id=”content”></div> </div> 当Content内容多时,即使main设置了高度100%或auto。在不同浏览器下还是不能完好...
这篇文章将详细介绍如何使背景图片自适应浏览器大小,并提供了两个解决方案。 一、背景图片自适应浏览器大小的重要性 在现在的响应式网页设计中,背景图片的自适应浏览器大小是一个非常重要的技术点。随着移动设备...
"jQuery图片自适应排列显示代码" 提供了一种解决方案,它利用了流行的JavaScript库jQuery以及一个名为"jquery.flex-images"的插件,来创建出类似谷歌图片流的效果。这种效果使得图片在不同尺寸的屏幕上都能以美观且...
在CSS中,我们可以使用`max-width`和`height: auto`来实现图片自适应。这样设置图片的宽度最大不超过容器宽度,高度则会按比例自动调整: ```css img { max-width: 100%; height: auto; } ``` 这段代码确保图片...
需要注意的是,图片自适应和拉伸可能导致图片质量损失,特别是在屏幕分辨率较大时。此外,由于图片拉伸的不可预见性,可能需要对图片进行优化处理,比如使用适合的图片尺寸和分辨率,或者在拉伸过程中保持图片的宽高...
要解决<div>不能随内部图片高度变化而自适应高度的问题,有几个方法可以尝试: 1. 使用overflow属性: 给<div>元素添加overflow:auto样式属性,可以让<div>根据内部内容自动调整高度。这种方法的优点是简单易行,...
htm页面图片自适应,在各个浏览器兼容,并且兼容分辨率!
例如,我们可以使用`<div class="slider">`包裹所有的图片,并为每张图片设置类名为`slide`。在jQuery中,可以使用`$('.slide')`选择所有图片元素。 2. **事件处理**:轮播通常包含“自动播放”和“用户手动切换”...
### CSS控制图片自适应大小详解 #### 一、引言 在现代网页设计中,确保图片能够根据不同的屏幕尺寸和设备类型自适应显示是至关重要的。这种能力不仅可以提高用户体验,还可以帮助保持页面的整体布局和美观度不受...
用jquery写的一个图片自适应效果, 能向windows的图片缩略图那样在web上展示图片, 图片容器的尺寸可任意设置, 使用方法简单: <div class="ImgWarp" src="images/2.jpg"></div> 引用js,然后通过css设置容器宽高,...
10. **预加载**:插件可以控制图片的预加载策略,确保用户在切换到下一张图片时能够快速显示。 在实际应用中,开发者首先需要在HTML中设置滑动容器和图片列表,然后通过引入bxSlider的JavaScript和CSS文件,并调用...
【首页滚动图片自适应源码模板】是一种网页设计中常见的元素,主要应用于网站首页,用于以动态滚动的方式展示多张图片,以增加视觉效果和用户体验。这种模板通常包含HTML、CSS和JavaScript三个主要部分,使得图片...