Transforming Text
text-transform property
- none
-
srcset属性よりもpicture要素のほうが、冗長なんだけどわかりすいところがいい。imageset要素でimg要素を内包して、img要素の属性にデバイスピクセル比とかviewportサイズとかを指定できるようにしてくれないかなあ。 #html
- capitalize
-
srcset属性よりもpicture要素のほうが、冗長なんだけどわかりすいところがいい。imageset要素でimg要素を内包して、img要素の属性にデバイスピクセル比とかviewportサイズとかを指定できるようにしてくれないかなあ。 #html
- uppercase
-
srcset属性よりもpicture要素のほうが、冗長なんだけどわかりすいところがいい。imageset要素でimg要素を内包して、img要素の属性にデバイスピクセル比とかviewportサイズとかを指定できるようにしてくれないかなあ。 #html
- lowercase
-
srcset属性よりもpicture要素のほうが、冗長なんだけどわかりすいところがいい。imageset要素でimg要素を内包して、img要素の属性にデバイスピクセル比とかviewportサイズとかを指定できるようにしてくれないかなあ。 #html
- full-width
-
srcset属性よりもpicture要素のほうが、冗長なんだけどわかりすいところがいい。imageset要素でimg要素を内包して、img要素の属性にデバイスピクセル比とかviewportサイズとかを指定できるようにしてくれないかなあ。 #html
CSS ShapesのWD仕様をもとに実装具合を検証中。今までの矩形ボックス配置にくらべて格段にビジュアル表現ができるようになりつつあるね。 #css http://makotonakaguchi.github.io/css_shapes/
CSS Text Module Level 3がLast Callになってる。美しくかつ気持ちの良い文字組に少しずつ近づいているのはありがたいことだ。どうせなら初期値でやってもらいたいくらいだ。
今まで作ってたHTMLを Google Web Designer で開こうと思ったら、エラーが出る。調べてみたら、このツールで作成したよっていうメタ情報がコードにあった。ドリとかBracketsとかを使ってるかたはmeta要素にコードを追加するといいよ。
White Space and Wrapping: white-space property
- normal
-
CSS ShapesのWD仕様をもとに実装具合を検証中。今までの矩形ボックス配置にくらべて格段にビジュアル表現ができるようになりつつあるね。 #css http://makotonakaguchi.github.io/css_shapes/
- pre
-
CSS ShapesのWD仕様をもとに実装具合を検証中。今までの矩形ボックス配置にくらべて格段にビジュアル表現ができるようになりつつあるね。 #css http://makotonakaguchi.github.io/css_shapes/
- nowrap
-
CSS ShapesのWD仕様をもとに実装具合を検証中。今までの矩形ボックス配置にくらべて格段にビジュアル表現ができるようになりつつあるね。 #css http://makotonakaguchi.github.io/css_shapes/
- pre-wrap
-
CSS ShapesのWD仕様をもとに実装具合を検証中。今までの矩形ボックス配置にくらべて格段にビジュアル表現ができるようになりつつあるね。 #css http://makotonakaguchi.github.io/css_shapes/
- pre-line
-
CSS ShapesのWD仕様をもとに実装具合を検証中。今までの矩形ボックス配置にくらべて格段にビジュアル表現ができるようになりつつあるね。 #css http://makotonakaguchi.github.io/css_shapes/
Line Breaking and Word Boundaries
line-break property
- auto
-
CSS Text Module Level 3がLast Callになってる。美しくかつ気持ちの良い文字組に少しずつ近づいているのはありがたいことだ。どうせなら初期値でやってもらいたいくらいだ。
- loose
-
CSS Text Module Level 3がLast Callになってる。美しくかつ気持ちの良い文字組に少しずつ近づいているのはありがたいことだ。どうせなら初期値でやってもらいたいくらいだ。
- normal
-
CSS Text Module Level 3がLast Callになってる。美しくかつ気持ちの良い文字組に少しずつ近づいているのはありがたいことだ。どうせなら初期値でやってもらいたいくらいだ。
- strict
-
CSS Text Module Level 3がLast Callになってる。美しくかつ気持ちの良い文字組に少しずつ近づいているのはありがたいことだ。どうせなら初期値でやってもらいたいくらいだ。
word-break prvoperty
- normal
-
今まで作ってたHTMLをGoogle Web Designer で開こうと思ったら、エラーが出る。調べてみたら、このツールで作成したよっていうメタ情報がコードにあった。ドリとかBracketsとかを使ってるかたはmeta要素にコードを追加するといいよ。
- keep-all
-
今まで作ってたHTMLをGoogle Web Designer で開こうと思ったら、エラーが出る。調べてみたら、このツールで作成したよっていうメタ情報がコードにあった。ドリとかBracketsとかを使ってるかたはmeta要素にコードを追加するといいよ。
- break-all
-
今まで作ってたHTMLをGoogle Web Designer で開こうと思ったら、エラーが出る。調べてみたら、このツールで作成したよっていうメタ情報がコードにあった。ドリとかBracketsとかを使ってるかたはmeta要素にコードを追加するといいよ。
Breaking Within Words
hyphens property
- manual
-
In Unicode, U+00AD is a conditional "soft hyphen" and U+2010 is an unconditional hyphen. Unicode Standard Annex #14 describes the role of soft hyphens in Unicode line breaking. [UAX14] In HTML, represents the soft hyphen character which suggests a hyphenation opportunity.
- auto
-
Words may be broken at appropriate hyphenation points either as determined by hyphenation characters inside the word or as determined automatically by a language-appropriate hyphenation resource. Conditional hyphenation characters inside a word, if present, take priority over automatic resources when determining hyphenation opportunities within the word.
overflow-wrap / word-wrap property
- break-word
-
In Unicode, U+00AD is a conditional "soft hyphen" and U+2010 is an unconditional hyphen. Unicode Standard Annex #14 describes the role of soft hyphens in Unicode line breaking. [UAX14] In HTML, represents the soft hyphen character which suggests a hyphenation opportunity.
Alignment and Justification
text-align property
- start
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- end
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- left
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- right
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- center
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- justify
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- match-parent
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- start end
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
text-align-last property
- auto
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- start
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- end
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- left
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- right
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- center
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
- justify
-
A block of text is a stack of line boxes. This property specifies how the inline-level boxes within each line box align with respect to the start and end sides of the line box. Alignment is not with respect to the viewport or containing block.
text-justify property
- auto
-
Webで容易に複雑なレイアウトがデザインできるようになるのはまだ先で今それを実現するにはJavaScriptや一枚ものの画像にする必要がある。今でもできるじゃん。って思えるかもしれないがこれでは情報へのアクセスと伝えるインターフェースという点で不十分。
- inter-word
-
Webで容易に複雑なレイアウトがデザインできるようになるのはまだ先で今それを実現するにはJavaScriptや一枚ものの画像にする必要がある。今でもできるじゃん。って思えるかもしれないがこれでは情報へのアクセスと伝えるインターフェースという点で不十分。
- distribute
-
Webで容易に複雑なレイアウトがデザインできるようになるのはまだ先で今それを実現するにはJavaScriptや一枚ものの画像にする必要がある。今でもできるじゃん。って思えるかもしれないがこれでは情報へのアクセスと伝えるインターフェースという点で不十分。
Spacing
word-spacing property
- normal
-
Additional spacing is applied to each word separator left in the text after the white space processing rules have been applied, and should be applied half on each side of the character unless otherwise dictated by typographic tradition.
- 〈length〉
-
Additional spacing is applied to each word separator left in the text after the white space processing rules have been applied, and should be applied half on each side of the character unless otherwise dictated by typographic tradition.
- 〈percentage〉
-
Additional spacing is applied to each word separator left in the text after the white space processing rules have been applied, and should be applied half on each side of the character unless otherwise dictated by typographic tradition.
letter-spacing property
- normal
-
CSS Shapesのカスタム形状ボックスに合わせて線と塗りを適用できればいいなあ。と思っているが、それはbackgroundやimg、SVGで表現してくれってことだな。矩形でない形状を浮動化できるようにすること、Regionsとともに複雑なレイアウトを実現させることが目的か。
- 〈length〉
-
CSS Shapesのカスタム形状ボックスに合わせて線と塗りを適用できればいいなあ。と思っているが、それはbackgroundやimg、SVGで表現してくれってことだな。矩形でない形状を浮動化できるようにすること、Regionsとともに複雑なレイアウトを実現させることが目的か。
Edge Effects
text-indent property
- 〈length〉
-
Additional spacing is applied to each word separator left in the text after the white space processing rules have been applied, and should be applied half on each side of the character unless otherwise dictated by typographic tradition.
- 〈percentage〉
-
Additional spacing is applied to each word separator left in the text after the white space processing rules have been applied, and should be applied half on each side of the character unless otherwise dictated by typographic tradition.
- each-line
-
Additional spacing is applied to each word separator left in the text after the white space processing rules have been applied, and should be applied half on each side of the character unless otherwise dictated by typographic tradition.
Indentation affects the first line of the block container as well as each line after a forced line break, but does not affect lines after a soft wrap break.
- hanging
-
Inverts which lines are affected.
Additional spacing is applied to each word separator left in the text after the white space processing rules have been applied, and should be applied half on each side of the character unless otherwise dictated by typographic tradition.
hanging-punctuation property
- first
-
EdgeReflowさっき使ってみた。サイトを企画しているときに説明するためのツールとしてはいいかも。 スタイルのこまかいところは調整する必要があるけど、文字と画像を一つずつ挿入しただけで、レイアウトのスタイル関係のものすごい長いIDの宣言とかとか。いずれはドリに統合されるのか、それとも新しいオーサリングになるのか。
microdataを学習中。情報を理解しやすく確認するだけでなく、使えるところに興味あり。googleでの資料を主に参考。その他のサイトは情報が少ないが、その分早く深いところまで探ることができる。実装してなんぼなんだけど、リッチスニペット以外の用途での利用が乏しい。
microdataでリッチスニペットを実装しようかと思ったが、ちゃんと実装できているか検証して、かつ確実に表示したいのなら申請しないといけないみたい。スパムの問題もあるし、まだ普及段階じゃないからだろうな。
- force-end
-
EdgeReflowさっき使ってみた。サイトを企画しているときに説明するためのツールとしてはいいかも。 スタイルのこまかいところは調整する必要があるけど、文字と画像を一つずつ挿入しただけで、レイアウトのスタイル関係のものすごい長いIDの宣言とかとか。いずれはドリに統合されるのか、それとも新しいオーサリングになるのか。
microdataを学習中。情報を理解しやすく確認するだけでなく、使えるところに興味あり。googleでの資料を主に参考。その他のサイトは情報が少ないが、その分早く深いところまで探ることができる。実装してなんぼなんだけど、リッチスニペット以外の用途での利用が乏しい。
microdataでリッチスニペットを実装しようかと思ったが、ちゃんと実装できているか検証して、かつ確実に表示したいのなら申請しないといけないみたい。スパムの問題もあるし、まだ普及段階じゃないからだろうな。
- allow-end
-
EdgeReflowさっき使ってみた。サイトを企画しているときに説明するためのツールとしてはいいかも。 スタイルのこまかいところは調整する必要があるけど、文字と画像を一つずつ挿入しただけで、レイアウトのスタイル関係のものすごい長いIDの宣言とかとか。いずれはドリに統合されるのか、それとも新しいオーサリングになるのか。
microdataを学習中。情報を理解しやすく確認するだけでなく、使えるところに興味あり。googleでの資料を主に参考。その他のサイトは情報が少ないが、その分早く深いところまで探ることができる。実装してなんぼなんだけど、リッチスニペット以外の用途での利用が乏しい。
microdataでリッチスニペットを実装しようかと思ったが、ちゃんと実装できているか検証して、かつ確実に表示したいのなら申請しないといけないみたい。スパムの問題もあるし、まだ普及段階じゃないからだろうな。
- last
-
EdgeReflowさっき使ってみた。サイトを企画しているときに説明するためのツールとしてはいいかも。 スタイルのこまかいところは調整する必要があるけど、文字と画像を一つずつ挿入しただけで、レイアウトのスタイル関係のものすごい長いIDの宣言とかとか。いずれはドリに統合されるのか、それとも新しいオーサリングになるのか。
microdataを学習中。情報を理解しやすく確認するだけでなく、使えるところに興味あり。googleでの資料を主に参考。その他のサイトは情報が少ないが、その分早く深いところまで探ることができる。実装してなんぼなんだけど、リッチスニペット以外の用途での利用が乏しい。
microdataでリッチスニペットを実装しようかと思ったが、ちゃんと実装できているか検証して、かつ確実に表示したいのなら申請しないといけないみたい。スパムの問題もあるし、まだ普及段階じゃないからだろうな。
- first force-end last
-
EdgeReflowさっき使ってみた。サイトを企画しているときに説明するためのツールとしてはいいかも。 スタイルのこまかいところは調整する必要があるけど、文字と画像を一つずつ挿入しただけで、レイアウトのスタイル関係のものすごい長いIDの宣言とかとか。いずれはドリに統合されるのか、それとも新しいオーサリングになるのか。
microdataを学習中。情報を理解しやすく確認するだけでなく、使えるところに興味あり。googleでの資料を主に参考。その他のサイトは情報が少ないが、その分早く深いところまで探ることができる。実装してなんぼなんだけど、リッチスニペット以外の用途での利用が乏しい。
microdataでリッチスニペットを実装しようかと思ったが、ちゃんと実装できているか検証して、かつ確実に表示したいのなら申請しないといけないみたい。スパムの問題もあるし、まだ普及段階じゃないからだろうな。