**div, span, p
==> 서로 관련이 있는 요소들 혹은 어떤 범위를
하나로 묶어서
모양을 변경한다거나
제어하기 위하여 사용합니다.
div, p 은 줄이 바뀌고
span 줄을 바꾸지 않고 영역을 선택할 수 있어요.
p는 보통 문자열로 구성된 단락을 표현할 때 많이 사용하고
다양한 요소로 구성된것들을 하나로 묶을 때에는 div를 주로 사용합니다.
--------------------------------------------------------------
버튼을 눌렀을때에
안보이던 div가 보이게 하고 싶어요
==> 웹 브라우저에서 동작하는(client side)
프로그램인 javascript를 이용합니다.
--------------------------------------------------------
**웹 프로그래밍 언어
- server side
==> JSP, 서블릿
==> 서버에서 동작하여 html을 생성한 다음 웹브라우저에게 응답하는 방식
- client side
==> java Script
==> 웹브라우저에 동작
----------------------------------------------------------
**CSS (cascading style sheet)
==> html문서의 인테리어를 위한 것입니다.
동일한 html요소이지만
css에 따라서 다르게 표현할 수 있어요.
css는 설정된 위치에 따라서
- 내부스타일
- 외부스타일
- 인라인스타일 로 나뉩니다.
내부스타일은
html문서의 head에
그 문서에서 사용될 스타일을 미리 만들어 두는 것을 말합니다.
외부스타일은
별도의 파일에 스타일을 설정하고
그파일을 html문서에 포함시켜 사용하는 것을 말합니다.
팀 프로젝트를 하는 경우라면 각 개발자들이
동일한 css를 적용해야하니 외부스타일을 사용하는 것이 좋겠습니다.
인라인스타일은
html태그에 바로 스타일을 직접 설정하는 것을 말합니다.
만약, 동일한 요소에
외부스타일, 내부스타일, 인라인스타일이 설정되어 있다면
인라인스타일이 가장 우선순위가 높고 내부스타일, 외부스타일 순으로 설정됩니다.
----------------------------------------------------------------
**스타일을 설정하는 방법
선택자{
스타일명:값,
스타일명:값,
..
}
선택자에는
스타일을 설정하고자 하는 html문서의 요소를 써줍니다.
태그명이 올수있고
id이름이 올 수도 있고
class이름이 올 수 있습니다.
---------------------------------------------------------
**색상의 표현
- red, green, blue등 문자열 값으로 설정
- #ffffff 의 16진수로 설정할 수 있어요.
rrggbb 빛의 3원색인 빨강,초록,파랑의 조합으로 색을 표현합니다.
각각 올 수 있는 값의 범위는 0~255(00~ff)
#ff0000 red, #00ff00 green
- rgb(값1,값2,값3) 0~255까지 표현할 수 있어요.
- rgba(값1,값2,값3,값4) 값4의 범위는 0~1사이의 값이 올 수 있어요.
----------------------------------------------------------------
**css의 주석처리방법
/*
*/
'프로그래밍 공부 정리 > html,css' 카테고리의 다른 글
| 텍스트 관련 스타일(2) (0) | 2021.12.09 |
|---|---|
| 주요 선택자, 텍스트 관련 스타일(1) (0) | 2021.12.08 |
| html의 여러가지 입력양식(2) (0) | 2021.12.06 |
| html의 여러가지 입력양식 (0) | 2021.12.05 |
| html의 태그 (0) | 2021.12.04 |