: 최대한 불필요한 태그, 스타일 없애기
협업으로 웹페이지 만드는 법
디자이너
: 디자인(포토샾, 피그마 등)해서 파일(파일+이미지리소스)을 넘긴다.
->
웹디자이너, 퍼블리셔, 프론트엔드 개발자
: 전체 골격을 확인하고 블록 구분 후 블록마다 클래스명 설계 등을 논의한다.
마크업
: html의 뼈대를 잡아주는 html을 작성하는 일
: html5 이전에는 div태그로 문서의 구조를 표현했다. 하지만 html5는 <selection, headerm article, footer 등의 태그를 사용해 문서 구조를 정확하게 표현할 수 있다.
css우선순위
style > id(태그 내 하나) > class(태그 내 여러개) > 태그
(+ div style로 적용안되던 걸 a style로 바꾸니까 적용됐다.)
요소
inline 요소 : 문자 등 직선적인 html 요소
block 요소 : 이미지 등 부피가 있는 요소
form태그 : 정보 전송
input 태그 : 입력칸을 만듦
html과 css를 연결하기 위해 head 사이에 <link rel="stylesheet" href="style.css">
<div> 영역 나눔
<p> 문단 나눔
<span> 일정 범위에 속성을 줌
html, body
: width기본값 100% (width: 100%)
img
: 이미지는 width를 정해주면 자동으로 height를 잡음
폰트
: 용량이 커서 몇번 쓰이지 않는다면 그 폰트를 쓴 이미지를 만들어서 이미지를 사용하는 게 나아.
RGB 색 모형
: red green blue 세가지 색을 이용하여 색을 표현하는 방식. (가산 혼합)
'HTML,CSS' 카테고리의 다른 글
HTML CSS 추가 기능 (0) | 2023.02.15 |
---|---|
Visual Studio Code(vscode) 단축키 (0) | 2023.02.03 |
HTML CSS 이중 스크롤바 없애기 (0) | 2023.01.30 |
HTML CSS 유용한 기능 모음 (0) | 2023.01.15 |