{"json_modified": "2016-08-18T03:37:18.533613", "uuid": "71bc31b9-a496-463a-ab0b-32b371df1814", "title": "columns", "url": "/zh-CN/docs/Web/CSS/columns", "tags": [], "translations": [{"uuid": "af4dbfd7-494e-4c9d-9b78-8b633b63a91c", "title": "columns", "url": "/en-US/docs/Web/CSS/columns", "tags": ["CSS", "Reference", "CSS Multi-columns", "CSS Property"], "summary": "The <strong><code>columns</code></strong> <a href=\"/en-US/docs/CSS\" title=\"CSS\">CSS</a> property is a shorthand property allowing to set both the <a href=\"/en-US/docs/Web/CSS/column-width\" title=\"The column-width CSS property suggests an optimal column width. The column-width is the maximum width a column will become before adding another column. For instance, a 300px column width a gap of 0px would be a single column at 599px, but at 600px it would be split into 2 columns.&#xA0;This allows us&#xA0;to achieve scalable designs that fit different screen sizes. Especially in presence of the column-count CSS property which has precedence, to set an exact column width, all length values must be specified. In horizontal text these are width, column-width, column-gap, and column-rule-width.\"><code>column-width</code></a> and the <a href=\"/en-US/docs/Web/CSS/column-count\" title=\"The column-count CSS property describes the number of columns of the element.\"><code>column-count</code></a> properties at the same time.", "localization_tags": [], "locale": "en-US", "last_edit": "2016-07-05T04:05:18", "review_tags": []}, {"uuid": "90bd48a8-e413-478b-86ec-305edba987ea", "title": "columns", "url": "/fr/docs/Web/CSS/columns", "tags": ["CSS", "Propri\u00e9t\u00e9", "R\u00e9f\u00e9rence"], "summary": "La propri\u00e9t\u00e9 <strong><code>columns</code></strong> est une propri\u00e9t\u00e9 raccourcie permettant de d\u00e9finir les deux propri\u00e9t\u00e9s <a href=\"/fr/docs/Web/CSS/column-width\" title=\"La propri&#xE9;t&#xE9; column-width permet de sugg&#xE9;rer une largeur de colonne optimale. Cette largeur repr&#xE9;sente la plus grande largeur que pourra occuper une colonne avant qu'une autre colonne soit ajout&#xE9;e. Ainsi, si on a une colonne large de 300px avec un &#xE9;cart de 0px, on pourrait placer une seule colonne sur 599px mais avoir deux colonnes avec 600px. Ce r&#xE9;glage permet donc d'obtenir des effets qui s'adaptent aux diff&#xE9;rentes tailles d'&#xE9;crans. Manipul&#xE9;e avec la propri&#xE9;t&#xE9; column-count qui a la pr&#xE9;c&#xE9;dence, il est n&#xE9;cessaire de d&#xE9;finir toutes les valeurs de longueur pour avoir une largeur de colonne CSS exacte. Pour du texte horizontal, ces propri&#xE9;t&#xE9;s sont width, column-width, column-gap et column-rule-width.\"><code>column-width</code></a> et <a href=\"/fr/docs/Web/CSS/column-count\" title=\"La propri&#xE9;t&#xE9; column-count d&#xE9;crit le nombre de colonnes d'un &#xE9;l&#xE9;ment lorsqu'on utilise une disposition en colonnes.\"><code>column-count</code></a> en m\u00eame temps.", "localization_tags": [], "locale": "fr", "last_edit": "2016-07-05T04:05:52", "review_tags": []}, {"uuid": "4cea0b14-3e1d-419c-a015-6e42851d0894", "title": "columns", "url": "/ja/docs/Web/CSS/columns", "tags": ["CSS", "CSS3", "CSS Reference", "css3-multicol"], "summary": "<a href=\"/ja/docs/CSS\" title=\"CSS\">CSS</a> \u306e <code>columns</code> \u30d7\u30ed\u30d1\u30c6\u30a3\u306f <a href=\"/ja/docs/Web/CSS/column-width\" title=\"CSS &#x306E; column-width &#x30D7;&#x30ED;&#x30D1;&#x30C6;&#x30A3;&#x306F;&#x3001;&#x6700;&#x9069;&#x306A;&#x5217;&#x5E45;&#x3092;&#x63D0;&#x6848;&#x3059;&#x308B;&#x3082;&#x306E;&#x3067;&#x3059;&#x3002;&#x3053;&#x306E;&#x5024;&#x306F;&#x7D76;&#x5BFE;&#x7684;&#x3067;&#x306F;&#x306A;&#x304F;&#x3001;&#x76EE;&#x5B89;&#x306B;&#x306A;&#x308B;&#x3082;&#x306E;&#x3067;&#x3059;&#x3002;&#x30D6;&#x30E9;&#x30A6;&#x30B6;&#x306F;&#x3001;&#x753B;&#x9762;&#x30B5;&#x30A4;&#x30BA;&#x306B;&#x5FDC;&#x3058;&#x305F;&#x62E1;&#x7E2E;&#x53EF;&#x80FD;&#x306A;&#x30C7;&#x30B6;&#x30A4;&#x30F3;&#x3092;&#x304B;&#x306A;&#x3048;&#x308B;&#x305F;&#x3081;&#x306B;&#x3001;&#x63D0;&#x6848;&#x3055;&#x308C;&#x305F;&#x5024;&#x306E;&#x5468;&#x8FBA;&#x3067;&#x5217;&#x306E;&#x5E45;&#x3092;&#x8ABF;&#x6574;&#x3057;&#x307E;&#x3059;&#x3002;&#x7279;&#x306B;&#x3001;&#x512A;&#x5148;&#x5EA6;&#x306E;&#x9AD8;&#x3044; column-count &#x30D7;&#x30ED;&#x30D1;&#x30C6;&#x30A3;&#x304C;&#x5B58;&#x5728;&#x3059;&#x308B;&#x3068;&#x304D;&#x306F;&#x3001;&#x6B63;&#x78BA;&#x306A;&#x5217;&#x5E45;&#x3092;&#x8A2D;&#x5B9A;&#x3059;&#x308B;&#x305F;&#x3081;&#x306B;&#x3001;&#x3059;&#x3079;&#x3066;&#x306E;&#x9577;&#x3055;&#x304C;&#x6307;&#x5B9A;&#x3055;&#x308C;&#x3066;&#x3044;&#x308B;&#x5FC5;&#x8981;&#x304C;&#x3042;&#x308A;&#x307E;&#x3059;&#x3002;&#x3059;&#x3079;&#x3066;&#x306E;&#x9577;&#x3055;&#x3068;&#x306F;&#x3001;&#x6A2A;&#x65B9;&#x5411;&#x306E;&#x30C6;&#x30AD;&#x30B9;&#x30C8;&#x3067;&#x306F; width&#x3001;column-width&#x3001;column-gap&#x3001;column-rule-width &#x3067;&#x3059;&#x3002;\"><code>column-width</code></a> \u3068 <a href=\"/ja/docs/Web/CSS/column-count\" title=\"&#x8981;&#x7D20;&#x306E;&#x30AB;&#x30E9;&#x30E0;&#x6570;&#x3092;&#x8A18;&#x8FF0;&#x3057;&#x307E;&#x3059;&#x3002;\"><code>column-count</code></a> \u306e\u4e21\u65b9\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u540c\u6642\u306b\u8a2d\u5b9a\u3067\u304d\u308b\u30b7\u30e7\u30fc\u30c8\u30cf\u30f3\u30c9\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002", "localization_tags": [], "locale": "ja", "last_edit": "2016-06-28T06:26:11", "review_tags": []}, {"uuid": "350899c3-1736-4bc3-a80c-8eaabca1c648", "title": "columns", "url": "/de/docs/Web/CSS/columns", "tags": ["CSS Mehrspalten Layout", "CSS", "Referenz", "Web", "CSS Eigenschaft", "Layout"], "summary": "Die <code>columns</code> <a href=\"/de/docs/Web/CSS\" title=\"CSS\">CSS</a> Eigenschaft ist eine Kurzform Eigenschaft, die es erlaubt, sowohl die <a href=\"/de/docs/Web/CSS/column-width\" title=\"Die column-width CSS Eigenschaft schl&#xE4;gt eine optimale Spaltenbreite vor. Dies ist kein absoluter Wert, sondern lediglich ein Hinweis an den Browser, welcher die Breite der Spalte anhand des vorgeschlagenen Wertes anpasst, was skalierbare Designs erm&#xF6;glicht, die sich verschiedenen Bildschirmgr&#xF6;&#xDF;en anpassen. Besonders wenn die column-count CSS Eigenschaft angegeben ist, welche Vorrang hat, wenn es darum geht, eine exakte Spaltenbreite zu setzen, m&#xFC;ssen alle L&#xE4;ngenwerte angegeben werden. In horizontalem Text sind dies width, column-width, column-gap und column-rule-width.\"><code>column-width</code></a> als auch die <a href=\"/de/docs/Web/CSS/column-count\" title=\"Die CSS Eigenschaft column-count bestimmt die Spaltenanzahl innerhalb eines Elements.\"><code>column-count</code></a> Eigenschaft auf einmal zu setzen.", "localization_tags": [], "locale": "de", "last_edit": "2016-06-28T06:27:37", "review_tags": []}], "modified": "2016-08-18T03:37:18", "label": "columns", "localization_tags": ["inprogress"], "locale": "zh-CN", "id": 151823, "last_edit": "2016-08-18T03:37:11", "summary": "<code>columns</code>\u00a0\u662f\u4e00\u4e2a\u7b80\u5199\u7684<a href=\"/en-US/docs/CSS\" title=\"CSS\">CSS</a>\u00a0\u5c5e\u6027\uff0c\u5141\u8bb8\u540c\u65f6\u8bbe\u7f6e\u00a0<a href=\"/zh-CN/docs/Web/CSS/column-width\" title=\"The column-width CSS property suggests an optimal column width. This is not a absolute value but a mere hint. Browser will adjust the width of the column around that suggested value, allowing to achieve scalable designs that fit different screen size. Especially in presence of the column-count CSS property which has precedence, to set an exact column width, all length values must be specified. In horizontal text these are width, column-width, column-gap, and column-rule-width.\"><code>column-width</code></a> \u548c<a href=\"/zh-CN/docs/Web/CSS/column-count\" title=\"colunm-count&#x8FD9;&#x4E2A;CSS&#x5C5E;&#x6027;&#xFF0C;&#x7528;&#x6765;&#x63CF;&#x8FF0;&#x8BE5;&#x5143;&#x7D20;&#x5E94;&#x8BE5;&#x88AB;&#x5212;&#x5206;&#x7684;&#x5217;&#x6570;.\"><code>column-count</code></a> \u5c5e\u6027\u3002", "sections": [{"id": "Quick_Links", "title": null}, {"id": "Summary", "title": "\u6982\u8ff0"}, {"id": "Syntax", "title": "\u8bed\u6cd5"}, {"id": "\u53d6\u503c", "title": "\u53d6\u503c"}, {"id": "Examples", "title": "\u793a\u4f8b"}, {"id": "Specifications", "title": "\u89c4\u8303"}, {"id": "Browser_compatibility", "title": "\u6d4f\u89c8\u5668\u517c\u5bb9\u6027"}], "slug": "Web/CSS/columns", "review_tags": []}