🙌들어가기 앞서...

JS 전문가되기 제목의 포스팅의 목적은 필자가 공부한 것을 복습하는데 그리고 약점을 보완하는데 있습니다.

1. CSS

CSS: Cascading Style Sheet
HTML 등의 Markup Language 로 작성된 문서가 실제로 웹사이트에 표현되는 방법을 정해주는 언어

1-1. CSS Selector

.class (ex: .intro)
// Selects all elements with class="intro"
.class1.class2 (ex: .name1.name2)
// Selects all elements with both name1 and name2 within its class attribute
ex) class="name1 name2"
.class1 .class2 (ex: .name1 .name2)
// Selects all elements with name2 that is a descendant of an element with name1
#id (ex: #firstname)
// Selects the element with id="firstname"
* (ex: *)
// Selects all elements
element (ex: p)
// Selects all p elements
elements.class (ex: p.intro)
// Selects all p elemetns with class="intro"
element, element (ex: div, p)
// Selects all div elements and all p elements
element element (ex: div p)
// Selects all p elements inside div elements
element > element (ex: div > p)
// Selects all p elements where the parent is a div element
element + element (ex: div + p)
// Selects the first p element that are placed immediately after div elements
element ~ element (ex: p ~ ul)
// Selects every ul element that are preceded by a p element
[attribute] (ex: [target])
// Selects all elements with a target attribute
[attribute=value] (ex: [target=_blank])
// Selects all elements with target="_blank"
[attribute~=value] (ex: [title~=flower])
// Selects all elements with a title attrubute containing the word "flower"
[attribute|=value] (ex: [lang|=en])
// Selects all elements with a lang attribute value starting with "en"
[attribute^=value] (ex: a[href^="https"])
// Selects every a element whose href attribute value begins with "https"
[attribute$=value] (ex: a[href$=".pdf"])
// Selects every a element whose href attribute value ends with ".pdf"
[attribute*=value] (ex: a[href*="w3schools"])
// Selects every a element whose href attribute value contains the substring "w3schools"

1-2. CSS ::Selector

추가예정

// 20201228