From 4f71387444b05df81fe47e2d6d99b159d0c0d4fe Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Sat, 3 Jul 2021 12:11:55 +0900 Subject: Web/CSS/width を更新 (#1290) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - conflicting 版は廃止ページからのリダイレクト前のものなので削除 - 2021/06/17 時点の英語版に同期 --- files/ja/_redirects.txt | 6 +- files/ja/_wikihistory.json | 14 ----- files/ja/conflicting/web/css/width/index.html | 30 --------- .../index.html | 38 ------------ files/ja/web/css/width/index.html | 72 ++++++++++------------ 5 files changed, 35 insertions(+), 125 deletions(-) delete mode 100644 files/ja/conflicting/web/css/width/index.html delete mode 100644 files/ja/conflicting/web/css/width_eaae26a6fb20ed3ef54fb23bfa0b1fcc/index.html (limited to 'files') diff --git a/files/ja/_redirects.txt b/files/ja/_redirects.txt index d80fc1bd2a..88aba76b91 100644 --- a/files/ja/_redirects.txt +++ b/files/ja/_redirects.txt @@ -421,7 +421,7 @@ /ja/docs/CSS/animation-timing-function /ja/docs/Web/CSS/animation-timing-function /ja/docs/CSS/attr /ja/docs/Web/CSS/attr() /ja/docs/CSS/aural /ja/docs/Web/CSS/@media/aural -/ja/docs/CSS/auto /ja/docs/conflicting/Web/CSS/width +/ja/docs/CSS/auto /ja/docs/Web/CSS/width /ja/docs/CSS/backface-visibility /ja/docs/Web/CSS/backface-visibility /ja/docs/CSS/background-attachment /ja/docs/Web/CSS/background-attachment /ja/docs/CSS/background-clip /ja/docs/Web/CSS/background-clip @@ -4415,7 +4415,7 @@ /ja/docs/Web/CSS/Using_multiple_backgrounds /ja/docs/conflicting/Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds /ja/docs/Web/CSS/attr /ja/docs/Web/CSS/attr() /ja/docs/Web/CSS/aural /ja/docs/Web/CSS/@media/aural -/ja/docs/Web/CSS/auto /ja/docs/conflicting/Web/CSS/width +/ja/docs/Web/CSS/auto /ja/docs/Web/CSS/width /ja/docs/Web/CSS/border-radius/border-radius /ja/docs/Web/CSS/border-radius /ja/docs/Web/CSS/border-top-left-radius_|_-moz-border-radius-topleft /ja/docs/Web/CSS/border-top-left-radius /ja/docs/Web/CSS/box_model /ja/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model @@ -5705,7 +5705,7 @@ /ja/docs/title /ja/docs/Web/HTML/Element/title /ja/docs/toSource /ja/docs/Web/JavaScript/Reference/Global_Objects/Object/toSource /ja/docs/toString /ja/docs/Web/JavaScript/Reference/Global_Objects/Object/toString -/ja/docs/width /ja/docs/conflicting/Web/CSS/width_eaae26a6fb20ed3ef54fb23bfa0b1fcc +/ja/docs/width /ja/docs/Web/CSS/width /ja/docs/window.clearInterval /ja/docs/Web/API/WindowOrWorkerGlobalScope/clearInterval /ja/docs/window.screenY /ja/docs/Web/API/Window/screenY /ja/docs/window.scrollMaxY /ja/docs/Web/API/Window/scrollMaxY diff --git a/files/ja/_wikihistory.json b/files/ja/_wikihistory.json index 5336ebae40..cb0ab8bb20 100644 --- a/files/ja/_wikihistory.json +++ b/files/ja/_wikihistory.json @@ -48917,20 +48917,6 @@ "sosleepy" ] }, - "conflicting/Web/CSS/width": { - "modified": "2019-03-24T00:00:43.619Z", - "contributors": [ - "ethertank", - "Taken" - ] - }, - "conflicting/Web/CSS/width_eaae26a6fb20ed3ef54fb23bfa0b1fcc": { - "modified": "2019-03-23T23:31:06.728Z", - "contributors": [ - "wbamberg", - "ethertank" - ] - }, "conflicting/Web/CSS_eb0c7d23f84df658710ebb6b4bdec8ea": { "modified": "2019-03-23T23:44:01.923Z", "contributors": [ diff --git a/files/ja/conflicting/web/css/width/index.html b/files/ja/conflicting/web/css/width/index.html deleted file mode 100644 index 4acaea3400..0000000000 --- a/files/ja/conflicting/web/css/width/index.html +++ /dev/null @@ -1,30 +0,0 @@ ---- -title: auto -slug: conflicting/Web/CSS/width -tags: - - CSS - - CSS Reference -translation_of: Web/CSS/width -translation_of_original: Web/CSS/auto -original_slug: Web/CSS/auto ---- -
- {{CSSRef}}
-

概要

-

ユーザエージェントによって自動的に計算される値です。その具体的な効果は auto が適用されたプロパティ毎にそれぞれ異なります。

-

auto 値の使用が可能なプロパティ

- diff --git a/files/ja/conflicting/web/css/width_eaae26a6fb20ed3ef54fb23bfa0b1fcc/index.html b/files/ja/conflicting/web/css/width_eaae26a6fb20ed3ef54fb23bfa0b1fcc/index.html deleted file mode 100644 index 7f5df2ea39..0000000000 --- a/files/ja/conflicting/web/css/width_eaae26a6fb20ed3ef54fb23bfa0b1fcc/index.html +++ /dev/null @@ -1,38 +0,0 @@ ---- -title: width -slug: conflicting/Web/CSS/width_eaae26a6fb20ed3ef54fb23bfa0b1fcc -tags: - - Disambiguation -translation_of: Web/CSS/width -translation_of_original: width -original_slug: width ---- -

width は多くの文脈で用いられます。

- -

CSS

- - - -

DOM

- - - -

SVG

- - - -

XUL

- - - -

これはあいまい性除去のページです — 同じ題名を共有している可能性のあるページをリストして案内を補助します。 記事のリンクからここに来たのであれば、戻って意図するページに直接行くように修正することもできます。

diff --git a/files/ja/web/css/width/index.html b/files/ja/web/css/width/index.html index b52da296f5..322e08849b 100644 --- a/files/ja/web/css/width/index.html +++ b/files/ja/web/css/width/index.html @@ -4,13 +4,13 @@ slug: Web/CSS/width tags: - CSS - CSS Property - - CSS プロパティ + - Layout - Reference - dimensions - - 'recipe:css-property' + - recipe:css-property - size - width - - 寸法 +browser-compat: css.properties.width translation_of: Web/CSS/width ---

{{CSSRef}}

@@ -21,11 +21,11 @@ translation_of: Web/CSS/width -

{{cssxref("min-width")}} および {{cssxref("max-width")}} プロパティは、 {{cssxref("width")}} を上書きします。

+

{{cssxref("min-width")}} および {{cssxref("max-width")}} プロパティは width を上書きします。

-

構文

+

構文

-
/* <length> 値 */
+
/* <length> 値 */
 width: 300px;
 width: 25em;
 
@@ -41,17 +41,11 @@ width: auto;
 /* グローバル値 */
 width: inherit;
 width: initial;
+width: revert;
 width: unset;
 

 
-
width プロパティは以下のいずれかの値で指定します。

-
-
-
-
値

+
値

 
 

  
{{cssxref("<length>")}}

@@ -68,38 +62,38 @@ width: unset;
  
利用可能な空間に対して fit-content 式を使用し、指定された引数に置き換えられます。すなわち min(max-content, max(min-content, <length-percentage>)) です。

 

 
-
アクセシビリティの考慮

+
アクセシビリティの考慮

 
 
ページを拡大してテキストサイズを大きくしたときに、 width を設定した要素が切り捨てられたり、他のコンテンツが見えなくなったりしないようにしてください。

 
 
 
-
公式定義

+
公式定義

 
 
{{CSSInfo}}

 
-
形式文法

+
形式文法

 
 {{csssyntax}}
 
-
例

+
例

 
-
既定の幅

+
既定の幅

 
-
p.goldie {
+
p.goldie {
   background: gold;
 }

 
-
<p class="goldie">The Mozilla community produces a lot of great software.</p>

+
<p class="goldie">The Mozilla community produces a lot of great software.</p>

 
 
{{EmbedLiveSample('Default_width', '500px', '64px')}}

 
-
ピクセル数と em 単位

+
ピクセル数と em 単位

 
-
.px_length {
+
.px_length {
   width: 200px;
   background-color: red;
   color: white;
@@ -114,26 +108,26 @@ width: unset;
 }
 

 
-
<div class="px_length">Width measured in px</div>
+
<div class="px_length">Width measured in px</div>
 <div class="em_length">Width measured in em</div>

 
 
{{EmbedLiveSample('Pixels_and_ems', '500px', '64px')}}

 
-
パーセント値

+
パーセント値

 
-
.percent {
+
.percent {
   width: 20%;
   background-color: silver;
   border: 1px solid red;
 }

 
-
<div class="percent">Width in percentage</div>

+
<div class="percent">Width in percentage</div>

 
 
{{EmbedLiveSample('Percentage', '500px', '64px')}}

 
 
max-content

 
-
p.maxgreen {
+
p.maxgreen {
   background: lightgreen;
   width: intrinsic;           /* Safari/WebKit uses a non-standard name */
   width: -moz-max-content;    /* Firefox/Gecko */
@@ -141,24 +135,24 @@ width: unset;
   width: max-content;
 }

 
-
<p class="maxgreen">The Mozilla community produces a lot of great software.</p>

+
<p class="maxgreen">The Mozilla community produces a lot of great software.</p>

 
 
{{EmbedLiveSample('max-content', '500px', '64px')}}

 
 
min-content

 
-
p.minblue {
+
p.minblue {
   background: lightblue;
   width: -moz-min-content;    /* Firefox */
   width: -webkit-min-content; /* Chrome */
   width: min-content;
 }

 
-
<p class="minblue">The Mozilla community produces a lot of great software.</p>

+
<p class="minblue">The Mozilla community produces a lot of great software.</p>

 
 
{{EmbedLiveSample('min-content', '500px', '155px')}}

 
-
仕様書

+
仕様書

 
 
@@ -177,7 +171,7 @@ width: unset;
   
-   
+   
@@ -192,13 +186,11 @@ width: unset;
  

  

    {{SpecName('CSS3 Sizing', '#width-height-keywords', 'width')}}
    {{Spec2('CSS3 Sizing')}}キーワード max-content, min-content, fit-content を追加キーワード max-content, min-content, fit-content を追加
   

   

    {{SpecName('CSS2.1', 'visudet.html#the-width-property', 'width')}}
 

 
-
ブラウザーの互換性

-
-
+
ブラウザーの互換性

 
-
{{Compat("css.properties.width")}}

+
{{Compat}}

 
-
関連情報

+
関連情報