HTML,CSS

HTML CSS 기본

Adev 2023. 2. 14. 15:04

: 최대한 불필요한 태그, 스타일 없애기 

 

협업으로 웹페이지 만드는 법

디자이너

: 디자인(포토샾, 피그마 등)해서 파일(파일+이미지리소스)을 넘긴다.
->
웹디자이너, 퍼블리셔, 프론트엔드 개발자 

: 전체 골격을 확인하고 블록 구분 후 블록마다 클래스명 설계 등을 논의한다.

 

마크업 

: 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