반응형
HTML, CSS 기초, 웹사이트 표준, 접근성, 크로스 브라우징
웹사이트 제작시 고려 사항
1. 웹 표준
웹 사이트를 작성할 때 따라야 하는 공식 표준이나 기술 규격
2. 웹 접근성
장애의 여부와 상관 없이 모두가 웹사이트를 이용할 수 있게 하는 방식
3. 크로스 브라우징
모든 브라우저 또는 기기에서 사이트가 제대로 작동하도록 하는 기법
Tag의 두 가지 요소
1) Block 요소
y축 정렬 형태로 출력 (줄바꿈 현상 나타남) 공간을 만들 수 있고, 상하 배치 작업 가능
2) Inline 요소
x축 정렬 형태로 출력 (한 줄에 출력) 공간을 만들 수 없고, 상하 배치 작업 불가능
CSS
• 정보(HTML)와 디자인(CSS)의 분리
• 문서의 레이아웃과 스타일 정의
• HTML로 작성된 정보를 꾸며주는 언어
css 적용 방법 3가지
1) 해당 Tag 안에 style='' 이라는 속성으로 직접 입력한다.
2) <head>태그 부분에 <style>이라는 태그 안에 css 구성 요소를 기입한다.
3) <head> 태그 부분에 <link> 태그로 '.css'파일을 불러온다.
누가 부모? 자식?
- 예시에서는 id를 가진 div 태그가 부모
- p, div가 자식
중요한 것은 누구를 기준으로 하는 지 확실히 해서 표현해야 한다.
선택자에 의한 캐스케이딩
style > id > class> type 순으로 우선순위가 높음
미디어 쿼리, !important, inline-block, 박스 모델 찾아보시면 좋을 듯 합니다.반응형
'지식' 카테고리의 다른 글
| TypeScript TS 타입스크립트란 정의 의미 (0) | 2023.03.21 |
|---|---|
| flex-grow flex-shrink 플렉스 그로우 쉬링크 사용법 예제 예시 (0) | 2023.03.21 |
| 정적 타입과 동적 타입 언어의 차이점 (0) | 2023.03.21 |
| SQLite MySQL PostgreSQL 차이 장단점 (0) | 2023.03.17 |
| tsx ts란 차이 다른점 (0) | 2023.03.14 |
댓글