選択者

新しい選択者、使い方を学びましょう!

1.*エストリスク!

私の知っている限りでは、エストリスクの使用方法は技術選択者全体です.
さらに詳しくは、親選択者のすべてのサブ要素を選択できます.

.class * {}
//형태로 사용이 가능하며, boder, margin등 모든속성이 각각의 태그에 모두 적용되므로 사용시 주의해야함.
//(class는 예시 선택자)

2. +, ~

.article + p {} 
//article 바로 다음에 위치한 형제요소중 p태그를 선택, 
.article ~ p {}
//article 다음에 위치한 형제요소중 모든 p태그를 선택, 

3. nth-child()

.class div:nth-child(2n)
// class의 자식중 짝수번째이고, div태그만 선택.
.class div:nth-child(2n+1)
// class의 자식중 홀수번째이고, div태그만 선택.
.class div:nth-child(n)
// class의 자식중 div태그만 선택 (n을 'n'으로 사용시).
.class div:nth-last-child(n)
// class의 자식중 마지막에서 n번째 태그선택.

4. not

p:not(#only)
//p엘리먼트중 id가 only인 엘리먼틀를 제외하고 선택.
//소괄호 안의 선택자를 제외하게됨.

Flex

display: flex親要素に属性を適用flex-direction : row(defaulte), column

サブエレメント使用flexプロパティ
flex:0 1 auto; (default)
flex:<収縮指数><ベースデフォルトサイズ>//収縮属性
grow、収縮属性単位はありません.
基礎値はgrow値が基準を下回る場合に適用されます.
grow値が0の場合、growによるn分割が正しい.

HTML

<textarea></textarea>タグを使用してウィンドウを作成し、複数行を入力できます.
CSSはresize : none属性を追加して小さくすることがあります.