ホームページ > 記事 > ウェブフロントエンド > HTML CSS??zoom learning_html/css_WEB-ITnose
大学で舞台プロジェクトを行っていたとき、非常に奇妙な現象に遭遇しました。kindEditor で写真をアップロードする機能が失敗しましたが、jsp によって参照されているスタイルを削除すると正常に動作しました。これは、スタイルを削除してテストしたところ、原因はZoomに落ちました。今日は週末で、珍しく暇な時間です。 :
Zoom 属性値:normal | コード 1-2 は次のとおりです:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-type" content="text/html; charset=UTF-8" /> <style type="text/css"> .test{zoom:normal;} </style> </head> <body> <h1 style="font-size:5pt;">zoom</h1> <h1>zoom</h1> <h1 class="test">zoom</h1> </body></html>
概要:
a.最初の「zoom」のフォントサイズは「5pt」、2番目の「zoom」のフォントサイズはデフォルト値を使用し、3番目の「zoom」フォントには「zoom:normal;」が追加されていることがわかります。 「 style list;
b. 図 1-2 コードから、最初の画像の幅が「50」、高さも「50」、サイズが「5pt」であることがわかります。2 番目の画像のサイズデフォルト値を使用し、3 番目の図では「zoom:normal;」スタイル リストを追加します。 2 番目の画像サイズはデフォルト値を使用し、3 番目の画像には「zoom:normal;」スタイル リストがあります。 2 つの点 a と b の説明 次の結論を導き出すことができます: n 法線は、要素に実際のサイズを使用させるために使用されます。
2.
コード 2-1 は次のとおりです。コード 2-2 は次のとおりです:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-type" content="text/html; charset=UTF-8" /> <style type="text/css"> .test{zoom:normal;} </style> </head> <body> <img src="./test.png" width = "50" height = "50"></img><br> <img src="./test.png"></img><br> <img src="./test.png" class="test"></img> </body></html>
画像 2-2
3.
コード 3-1 は次のとおりです。
写真 3-
注: Zoom との互換性の問題のため、実際の応用例は多くありませんが、一般的な理解だけで十分です。ダウンロード 下 [0 ポイント ダウンロード デモンストレーション リソース]