در خیلی از مواقع ما نیاز داریم تعیین کنیم که عکس مورد نظرمان، هرگز بزرگتر از عنصر حاوی خود نمایش داده نشود (یعنی اگر عکس بزرگتر از اندازه عنصر حاوی خود بود، آنگاه کوچکتر از اندازه واقعی خود و به اندازه عنصر حاوی خود، نمایش داده شود) و همچنین آن را بزرگتر از اندازه واقعی خود نیز نبینیم (اگر عنصر حاوی عکس، از اندازه واقعی عکس بزرگتر است، عکس به اندازه واقعی خود نمایش داده شود، نه اندازه عنصر حاوی آن).

برای این منظور می توانیم کلاس w3-image در چارچوب W3.CSS را به کار ببریم.

کلاس w3-image به صورت زیر برای تگ img به کار می رود (تگ img برای نمایش عکس به کار می رود - کلید شماره 507 ) :

به مثال زیر توجه کنید :