首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

最大直列大小 | max-inline-size

这是一种实验技术

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

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

代码语言:javascript
复制
/* <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-widthmax-height

形式语法

代码语言:javascript
复制
<'max-width'>

HTML内容

代码语言:javascript
复制
<p class="exampleText">Example text</p>

CSS内容

代码语言:javascript
复制
.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

扫码关注腾讯云开发者

领取腾讯云代金券

http://www.vxiaotou.com