最小塊大小 | min-block-size (Logical Properties) - CSS 中文開發手冊 - Break易站

•   CSS 中文開發手冊

  最小塊大小 | min-block-size (Logical Properties) - CSS 中文開發手冊

  這是一種實驗技術

  因爲該技術的規格不穩定，請查看各類瀏覽器的兼容性表格以供使用。還要注意，隨着規範的變化，實驗技術的語法和行爲在將來版本的瀏覽器中可能會發生變化。

  min-block-size一個元素的塊的最小水平或垂直尺寸，這取決於它的寫入模式。其對應於任一min-width或min-height屬性，這取決於的值writing-mode。

  /* <length> values */
  min-block-size: 100px;
  min-block-size: 5em;
  
  /* <percentage> values */
  min-block-size: 10%;
  
  /* Keyword values */
  min-block-size: max-content;
  min-block-size: min-content;
  min-block-size: fit-content;
  min-block-size: fill-available;
  
  /* Global values */
  min-block-size: inherit;
  min-block-size: initial;
  min-block-size: unset;

  若是寫做模式是垂直定向的，則min-block-size與元素的最小寬度有關；不然，它涉及元素的最小高度。相關財產是min-inline-size，它定義元素的其餘維度。

  初始值	0
  應用於	same as width and height
  是否繼承	no
  百分比	block-size of containing block
  適用媒體	visual
  計算值	same as min-width and min-height
  Animation type	discrete
  規範順序	the unique non-ambiguous order defined by the formal grammar

  句法

  價值

  min-block-size取值爲min-width和min-height

  形式語法

  <'min-width'>

  例

  HTML

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

  CSS

  .exampleText {
    writing-mode: vertical-rl;
    background-color: yellow;
    min-block-size: 200px;
  }

  規格

  Specification	Status	Comment
  CSS Logical Properties Level 1The definition of 'min-block-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 中文開發手冊