Laravel  
laravel
文档
数据库
架构
入门
php技术
    
Laravelphp
laravel / php / java / vue / mysql / linux / python / javascript / html / css / c++ / c#

css img自适应

作者:战虎天下   发布日期:2026-04-06   浏览:61

/* 使 img 标签内的图片自适应其容器的宽度 */
img {
    max-width: 100%; /* 图片的最大宽度为容器的100% */
    height: auto;    /* 保持图片的宽高比 */
}

解释说明:

  • max-width: 100%;:确保图片的最大宽度不会超过其父容器的宽度,从而实现自适应效果。
  • height: auto;:自动调整图片的高度以保持原始的宽高比,避免图片变形。

这样设置后,图片会根据其容器的大小自动调整自身的宽度和高度,而不会超出容器的边界。

上一篇:css 背景颜色渐变

下一篇:css 鼠标

大家都在看

css好看的字体

css 红色

css 瀑布流布局grid

css盒子

css三种引入方式

换行 css

css文字超长省略号

css图片铺满整个背景

css背景图铺满

css 渐变字体

Laravel PHP 深圳智简公司。版权所有©2023-2043 LaravelPHP 粤ICP备2021048745号-3

Laravel 中文站