제로베이스 프론트엔드 스쿨 23기17 (기초) HTML 과 CSS ( style 태그, class와 id속성, Link태그로 CSS파일 불러오기) HTML : 웹페이지의 내용 index.html 로 확장자 파일 생성하기 태그 안에서 태그의 속성으로 디자인을 입혀줄 수 있다. 선택자로 class , id 가 있다. ( id는 1번만 선언할 수 있다! ) class 는 스페이스바로 여러개 지정 가능 CSS : 웹페이지의 디자인 style.css 로 확장자 파일 생성하기 {속성 : 값 ; } 로 마무리한다 ctrl+e 로 class,id의 CSS속성으로 바로가기. ctrl 마우스 올리면 속성으로 바로 보임 (css peek 확장자) (스타일 속성은 inline> id > class 순서로 입힌다.) [예제1] Document p { font-size: 36px; color: pink; font-weight: 900; } .title { color: re.. 2023. 12. 13. (입문)비주얼 스튜디오(Visual Studio)에서 HTML 선언하기( HTML실행) 파일생성 > 내용에 > ! 엔터 DOCTYPE html> Document 2023. 12. 13. (기초) HTML 이란? (구성과 특성) HTML : HyperText Markup Language 개발자가 사용자(유저)에게 보여주고 싶은 컨텐츠를 브라우저가 읽을 수 있도록 만들어 놓은 문서이다. 사용자 (유저) 브라우저 ( 크럼, 웨일, 등등) ㅡ 구성 ( tag ,컨텐츠, 주석 등 ) DOCTYPE html> tag를 열고 닫아서 컨텐츠를 입력 ㅡ 특성 tag들은 계층적으로 이루어져 있다! ( 부모 > 자식 관계 등) 부모태그 닫기 전에 자식태그를 작성해야함. ㅡ비주얼코드 에서 HTML 선언하기 DOCTYPE html> Document 2023. 12. 13. (입문) 비주얼 스튜디오(Visual Studio) 기본 확장자( 확장팩 ) 설치 먼저, 왼쪽아이콘의 가장 밑단 블럭아이콘 클릭해서 검색후 [확장] 설치하기. 기본 확장자에는 아래의 4가지가 있다. 1. Live Server : 실시간으로 실행시켜주는 확장팩 2. CSS Peek : CSS코드를 보다 간편하게 보여줌. 3. Prettier : 자동 줄맞춤 (Beautify 가 삭제되서 대체 사용함) 4. Material Theme : 속성마다 색상이 다름. 구별하기 쉬움. >> 아주 다양한 확장팩들이 있다. 사용해 보다가 확장팩 추가하는 재미도 있음 [ 비주얼코드 단축키 ] 단축키 명령어 tab으로 생성함 p.title 클래스생성 p#heading 아이디생성 p*5 p태그 5개 생성 등등 2023. 12. 13. 이전 1 2 3 4 5 다음
