今日はcssの使用について話しましょう。これは画像効果です
1.画像サイズ、境界線
画像のサイズ、imgの属性widthとheightを直接使用して設定できます
ボーダーにはCSSスタイルを使用する必要があります。ボーダーを使用して設定します
ご覧のとおり、私たちの写真には幅1pxの赤い実線の境界線があり、実線は実線であり、もちろん点線があります
2つの混合グラフィックとテキスト
この画像とテキストの混合は重要なポイントです。通常、レイアウトでこれを使用する必要があります
組版せずに状況を見てみましょう
ご覧のとおり、画像はそれ自体で1行を占め、右側は空で、テキストは下にあります
写真が左右に浮くように設定しましたので、見てみましょう
あなたは私たちのテキストが通過したかどうかを見ることができます、そしてそれから私たちはいくつかの例のためにこの単語を絵から遠ざけることができます、いくつかのスタイルを追加しましょう
テキストから一定の距離ですか？
3、フィレットの写真
これはcss3の新しいもので、画像の境界線を変形させる可能性があります。これは使用される境界線の半径です。
ご覧のとおり、この写真の四隅はすべて湾曲しています
4つのレスポンシブ写真
私たちの将来のウェブサイトは、この種のレスポンシブ画像を必要としています。そうでない場合、画像のサイズは固定され、携帯電話とコンピューターの画面での表示によって異なります。レスポンシブ画像は、さまざまなサイズの画面に自動的に適応します。
見てみましょう
次に、電話モードを使用して確認します
ご覧のとおりOKです。この方法で画像を表示します。
このブログはここにあります、誰もがそれを練習します、そうでない場合は、私にQQ：2100363119を追加できます、もちろん、写真のスタイルはそれ以上です、他の人はhttps://www.runoob.com/css3を見ることができます/ css3-images.html初心者 チュートリアル
最近、私の公式ウェブサイトが開かれました、あなたはそれをチェックすることができます：https：//www.lemon1234.com