Mfano wa CSS @container

定义和用法

CSS @container 规则用于根据容器的大小或样式为其他元素定义样式。

样式声明会根据条件进行过滤，如果条件为真，则应用于容器。当容器的大小或样式值发生变化时，条件会被重新评估。

提示：在 CSS 中，容器是一个包裹其他元素的元素，用于将它们分组以便进行样式设置。

mada

Tumia maelezo kwa kufungua maelezo ya maelezo kwa kina au maelezo ya maelezo ya maelezo.

.parent {
  container-name: myContainer;
  container-type: inline-size;
}
/* Add styles if myContainer is less than 500px wide */
@container myContainer (width < 500px) {
  .child {
    width: 50%;
    border: 2px solid maroon;
    background-color: salmon;
  }
}

Jifunze kueleza

Muundo wa CSS

@container containername (containerquery) {
  mabomu ya css
}

athari ya kina

Mwongozo wa kibuka

数字 katika tablica inaeza na msingi na kumekan kwa kumaliza @ kaidi.