How to scale down the image proportion in a td or table (css problem,

How to scale down the image proportion in a td or table (css problem,

I have talked a lot about setting the div width on the Internet, especially this article:

Http://www.divcss5.com/wenji/w632.shtml

Why do we need auto scaling for the dead? Is there too much resolution on the phone screen? How can I scale the specified width? Your sister's.

After many experiments, I found that a good method can be perfectly displayed in ios/browser and android/browser, that is:

1. div is not required, so it is better to center the content.

2. Put a table, and the width of the table is 100%. This is the most important thing.

3. Put an img in td, and the max-width of img is 100%;

This is OK!

A style sheet is attached:

Table {
Width: 100%;
Margin: 0 auto;
Background: # 2d2d2d;/* browsers that don't support rgba */
Background: rgba (45, 45, 45,. 15 );
Font-family: 'pt Sans ', Helvetica, Arial, sans-serif;
Font-size: 20px;
/* Color: #0; one 0 is not allowed */
Border: none;
Border-collapse: collapse;
Text-shadow: 0 1px 2px rgba (0, 0, 0,. 3 );


}
Td {
/* Max-width: 100%; Mozilla only supports a max-width CSS syntax */
Background: # ffffff;
Border: none;/* solid #000 1px ;*/
Vertical-align: center;
Text-align: center;
Color: #000;
}


/* Automatically scale the screen width of the device from the image on the sharing page */
Img. sharepage {
Max-width: 100%;
}