img {
  max-width: 100%; /* 使图片不超过其容器的宽度 */
  height: auto;    /* 保持图片的纵横比例 */
}

img.rounded {
  border-radius: 10px; /* 使用 border-radius 属性创建圆角 */
}

.container {
  text-align: center; /* 将文本对齐方式设置为居中 */
}

.centered-img {
  display: inline-block; /* 使图片作为行内块级元素 */
}

.responsive-img {
  max-width: 100%;
  height: auto;
}

.float-img {
  float: left; /* 浮动到左侧 */
  margin-right: 20px; /* 可选，为了增加图片与周围内容的间距 */
}

.bg-img-container {
  background-image: url('path/to/image.jpg');
  background-size: cover; /* 使背景图覆盖整个容器 */
  background-position: center center; /* 居中显示背景图 */
  height: 300px; /* 设置容器高度 */
}

.transparent-img {
  opacity: 0.7; /* 设置透明度，值从0（完全透明）到1（完全不透明） */
}