본문 바로가기
Back/web

생활코딩WEB2_CSS선택자와 우선순위

by 자바꿈나무00 2023. 3. 4.

이 글은 https://opentutorials.org/module/3180/18872생활코딩 이고잉님의 강의를 보고 복습하면서 작성한 글이므로 모든 내용은 아래 opentutorials.org의 내용을 참고하여 작성되었습니다.

 

웹브라우저 제어 - WEB2 - JavaScript

웹브라우저 제어 2017-12-01 03:34:56

opentutorials.org

 

 

8. 웹브라우저 제어

html

night, day 버튼 클릭시 background-color, color변화시키려면 html은 정적이지만 js로 작성해야 동적으로 작동시킬 수 있다.

 

 

9~11. style 속성을 이용해서 CSS 사용하기

검색방법

 

적용 후

 

<div>는 어떤 의미도 기능도 없지만 css를 통해서 제어하고 싶을 때 사용한다. 화면 전체를 쓰기 때문에 줄바꿈이 된다.

<span>은 div와 같은 용도로 쓰지만 줄바꿈이 되고 싶지 않을 때 사용한다.

 

CSS선택자 

클래스값 사용시 .클래스명{}

아이디값 사용시 #아이디명{}

아이디는 식별, 클래스는 그룹핑하는 것이다.

=> 광범위하게 설정할 경우에는 클래스 선택자를 사용하고 작은 부분을 변경하려는 경우에는 아이디 선택자를 사용해라.

 

선택자 우선순위

태그 선택자 < 클래스 선택자 <아이디 선택자

 

 

 

 

 

 

 

'Back > web' 카테고리의 다른 글

생코WEB2_js 낮,밤 모드 버튼!  (0) 2023.03.04
생활코딩WEB2_js 데이터타입, 변수, 대입 연산자  (0) 2023.03.04
2023.02.09_1~8교시  (0) 2023.02.09
2023.02.07_EL,  (0) 2023.02.07
JSP_20230203_1~4교시  (0) 2023.02.05