<! Doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.111cn.net/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> code for proportional scaling of css images </title>
<Style type = "text/css">
| The code is as follows: | Copy code |
| . Thumbimg {max-width: 530px; max-height: 530px;}/* for firefox & ie7 */ * Html. thumbimg {width: expression (this. width> 530 & this. width> this. height? & Quot; 530px & quot;: auto); height: expression (this. height> 530? "530px": auto);}/* for ie6 */ |
|
// Method 2
| The code is as follows: | Copy code |
| Img { Width: expression (this. offsetwidth> 160? 160: true);/* modify the image width by yourself */ Height: expression (this. offsetheight> 180? 180: true);/* modify the image height by yourself */ } |
|
// Method 3
| The code is as follows: | Copy code |
| Div { |
|
// Method 4
| The code is as follows: | Copy code |
| # Thumbimaged img { Max-width: 120px; Max-height: 140px; } /* For firefox & ie7 */ # Thumbimaged img { /* For ie6 */ Width: expression (this. width> 120 & this. width> this. height? "140px": auto ); Height: expression (this. height> 120? "140px": auto ); } |
|
Method 5
| The code is as follows: | Copy code |
| Width: expression (this. width> 100 & this. width> this. height? 100: true); height: expression (this. height> 100? 100: true ); | |
</Style>
</Head>
<Body>
</Body>
</Html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
