본문 바로가기

html3

html 시멘틱 태그 시멘틱 태그를 쓰는 이유는 를 남발하는 것보단 그 레이아웃의 기능에 따라 등으로 작성을하면 코드를 볼 때 훨씬 직관적으로 보이게 됨 ​ 다만 저의 주관적 생각으론 밑의 주소에 있는 태그중 생소한 것들은 저뿐만 아니라, 다른 개발자들에게 오히려 불편함을 줄 것이라 생각해 생소한것들은 사용여부를 한번 생각해봐야 할 필요는 있음 ​ https://developer.mozilla.org/ko/docs/Web/HTML/Element HTML 요소 참고서 - HTML: Hypertext Markup Language | MDN 이 페이지는 태그를 사용해 만들 수 있는 모든 HTML 요소의 목록을 제공합니다. developer.mozilla.org 2022. 1. 14.
css display,position display block : 한줄에 하나씩 배치 inline : 해당 엘리먼트 내부에 있는 컨텐츠 크기 만큼만 위치 inline-block : 해당 엘리먼트의 크기만큼 위치 flex flex박스 단계의 속성 - flex-direction : 요소들의 방향을 정해줌 [ row(기본값) / row-reverse(오른쪽>왼쪽) / column(위>아래) column-reverse(아래>위)​ ] - flex-wrap : 요소들이 많아질시 요소들의 처리 [ nowrap(기본값) : 요소들이 많아질시 요소들을 작게 만들어 빼곡하게 처리 / wrap : 요소들이 많아질시 지정된 크기를 바꾸지 않고 다음 줄로 넘어감 / wrap-reverse : wrap의 반대방향으로 ] - flex-flow : 위 directio.. 2022. 1. 14.
visual studio code 필수 확장프로그램 제가 사용하는 확장프로그램들 입니다. Material Theme : vscode의 테마를 설정 Material Icon Theme : 파일등 아이콘들의 테마가 변경 Bracket Pair Colorizer : 괄호 중첩등의 상황에서 구별을 쉽게 해줌 Auto Rename Tag : 앞에 태그를 바꿀 시 뒤의 태그를 자동으로 바꿔줌 Auto Close Tag : 앞에 태그를 생성 시 자동으로 닫는 태그 생성 Css Peek : html파일에서 css파일을 금방 찾게해줌 (컨트롤키를 누른 상태로 html요소를 클릭시 정의된 css파일로 이동) html css support : html에서 자동적으로 css관련 태그를 완성시켜줌 Live Server : 새로고침 없이 자동으로 브라우저화면을 업데이트 Color.. 2022. 1. 14.