div css 动易 文章内容页 图片自动缩放

html-css07

div css 动易 文章内容页 图片自动缩放,第1张

div+css怎么让背景图片自动缩放

body {

  background: url("./../img/bg.jpg") fixed center center no-repeat

  background-size: cover

  width: 100%

}

css图片缩放 通过css控制图片自动缩放至css定义大小

方法代码如下： <http://houdunwang.com/lesson.html>

<div class=”UBBPanel”>

<div class=”UBBTitle”>

<img src=”images/code.gif” style=”margin:0px 2px -3px 0px” alt=”程序代码”/>程序代码</div>

<div class=”UBBContent”>.new_body .con img{vertical-align: middlemax-width: 630pxwidth: expression(this.width >630 &&this.height <this.width ? 630: true)}

</div></div>

同样可以用对高度进行控制。

这种方法可以满足: 一个页面中，不同图片，超过所需大小时，自动缩成不同尺寸的需求。

应用面也很广，比如：一般的CMS等文章管理中，通常都有小图、大图。而我们在页面上，通常需要读取同一个图片，而分不同尺寸显示。再结合 overflow:hidden相信图片也就不会变形了。

程序代码如下:

.pwl_spaceimg{width:160pxheight:120pxoverflow:hidden}

.pwl_spaceimg img{width:150pxborder:0pxpadding:4px}

首先要讲，这个效果最好用js解决。下面是CSS解决方法代码如下：

img {

max-width:400px

_width:expression_r(this.width<400px?"auto":"400px")

}

expression是针对IE6用的，在FF和IE7+版本max-width就行了

更多问题到问题求助专区｛http://bbs.houdunwang.com/｝

DIV+CSS是网站标准（或称“WEB标准”）中常用的术语之一，通常为了说明与HTML网页设计语言中的表格（table）定位方式的区别，因为XHTML网站设计标准中，不再使用表格定位技术，而是采用DIV+CSS的方式实现各种定位。

CSS是英语Cascading Style Sheets（层叠样式表单）的缩写，它是一种用来表现 HTML 或 XML 等文件式样的计算机语言。

DIV元素是用来为HTML文档内大块（block-level）的内容提供结构和背景的元素。DIV的起始标签和结束标签之间的所有内容都是用来构成这个块的，其中所包含元素的特性由DIV标签的属性来控制，或者是通过使用样式表格式化这个块来进行控制。