ホームページ > ウェブフロントエンド > htmlチュートリアル > 画像の縮小と画像の配置_html/css_WEB-ITnose

画像の縮小と画像の配置_html/css_WEB-ITnose

WBOY
リリース: 2016-06-24 12:03:41
オリジナル
1793 人が閲覧しました

サムネイルを作成したいのですが、全体画像のサムネイルが小さすぎます
適切なサイズに縮小し、オーバーフローを使用して表示サイズを切り出します
ただし、画像は左から配置され、画像内の一部の情報が表示されます。
アドバイスをください

.post{float: left;width: 210px;height: 150px;overflow:hidden;background-color: #fff;margin: 10px 0px 0px 10px;}.post img{max-width: 300px;max-height: 167px;}
ログイン後にコピー

効果は次のとおりです


ディスカッションへの返信 (解決策)

トリミングに使用される div の相対位置を設定します。縮小画像の絶対位置を設定すると、それを制御できます 左または上に配置して必要な領域を表示すると、余分な領域が div によってトリミングされます

トリミングに使用される div の相対位置を設定します。 Position:relative;

次に、縮小画像の絶対位置を設定すると、左または上の位置を制御することで必要な領域を表示でき、余分な領域は div によってトリミングされます

正しい解決策


トリミングに使用する div の相対位置を設定します。position:relative;

次に、縮小画像を絶対位置に設定すると、位置の左または上を制御して必要な領域を表示でき、余分な領域がトリミングされます。 div

正しい解決策

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート