TD またはテーブル内の画像を縮小する方法 (CSS の問題) を自動的に拡大縮小する photos_html/css_WEB-ITnose

インターネット上では、p

の幅を設定して人を殺すというコメントがたくさんあります。なぜ自動的にスケールする必要があるのですか？携帯電話の画面が解像度高すぎるからではないでしょうか？幅を指定した場合、どのように拡大縮小できますか?あなたの妹。

多くの実験を行った結果、iOS WeChat/ブラウザと Android WeChat/ブラウザの両方で完璧に表示できる、より良い方法を見つけました。

1. p の要件はなく、コンテンツを中央に配置するだけです。 2. テーブルを入れます。テーブルの幅 = 100%、これが最も重要です

3. 画像を td に入れます。画像の最大幅: 100%;

これでOKです。

スタイルシートを添付します:

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; 不能用1个0 */
 border: none;
 border-collapse: collapse;
 text-shadow: 0 1px 2px rgba(0,0,0,.3);
 
 
 }
 td{
 /* max-width:100%; Mozilla才支持一个max-width 的CSS语法 */
 background: #ffffff;
 border: none; /*solid #000 1px;*/
 vertical-align:center;
 text-align:center;
 color: #000;
 }
 
 
 /* 分享页面图片自动缩放设备屏幕宽度 */
 img.sharepage{
 max-width:100%;
 }