最大直列大小 | max-inline-size (Logical Properties)

  CSS 中文开发手册

最大直列大小 | max-inline-size (Logical Properties) - CSS 中文开发手册

这是一种实验技术

由于该技术的规格不稳定，请查看各种浏览器的兼容性表格以供使用。还要注意，随着规范的变化，实验技术的语法和行为在未来版本的浏览器中可能会发生变化。

max-inline-size 取决于其写入模式元素的块的水平或垂直最大尺寸。它对应于max-width或max-height取决于定义的值的属性writing-mode。如果书写模式是垂直定向的，则其值max-inline-size与元素的最大高度有关，否则与元素的最大宽度有关。它涉及到max-block-size，它定义了元素的另一个维度。

/* <length> values */
max-inline-size: 300px;
max-inline-size: 25em;

/* <percentage> values */
max-inline-size: 75%;

/* Keyword values */
max-inline-size: none;
max-inline-size: max-content;
max-inline-size: min-content;
max-inline-size: fit-content;
max-inline-size: fill-available;

/* Global values */
max-inline-size: inherit;
max-inline-size: initial;
max-inline-size: unset;

初始值	0
应用于	same as width and height
是否继承	no
百分比	inline-size of containing block
适用媒体	visual
计算值	same as max-width and max-height
Animation type	discrete
规范顺序	the unique non-ambiguous order defined by the formal grammar

句法

价值

max-inline-size取值为max-width和max-height

形式语法

<'max-width'>

例

HTML内容

<p class="exampleText">Example text</p>

CSS内容

.exampleText {
  writing-mode: vertical-rl;
  background-color: yellow;
  block-size: 100%;
  max-inline-size: 200px;
}

规格

Specification	Status	Comment
CSS Logical Properties Level 1The definition of 'max-inline-size' in that specification.	Editor's Draft	Initial definition

浏览器兼容性

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari (WebKit)
Basic support	No support	41.0 (41.0)1	No support	No support	No support

Feature	Android	Firefox Mobile (Gecko)	IE Phone	Opera Mobile	Safari Mobile
Basic support	No support	41.0 (41.0)1	No support	No support	No support

  CSS 中文开发手册

  本文标题：最大直列大小 | max-inline-size (Logical Properties) – CSS 中文开发手册 - Break易站

转载请保留页面地址：https://www.breakyizhan.com/css/32043.html