학습단/HTML+CSS+Javascript 학습단18 5장 css 필수 속성 다루기 공부할 내용 (172~222쪽) 1. 단위 -절대 단위는 px가 있다. px 한가지이며 모니터 화면을 구성하는 사각형 1개의 크기를 의미한다. -상대 단위는 % , em , rem, vw, vh 가 있다. % : 해당 속성의 상위요소 속성값에 상대적인 크기를 가진다. em : 부모 요소의 텍스트 크기에 상대적인 크기를 가진다. rem : html 태그의 텍스트 크기에 상대적인 크기를 가진다. vw : 뷰포트의 너비를 기준으로 상대적인 크기를 가진다. (1vw는 뷰포트 너비의 1/100) vh : 뷰포트의 높이를 기준으로 상대적인 크기를 가진다.(1vh는 뷰포느 높이의 1/100) 2. 색상 표기법 키워드 표기법: 색상의 영문명을 속성값으로 사용하는 방법이다. RGB 색상 표기법: RGB는 빨간색 초록색 .. 2023. 3. 11. 4장 CSS 선택자 다루기 공부할 내용 (142~169쪽) 1. 기본 선택자 사용하기 -전체선택자 전체 선택자는 HTML에서 사용할 수 는 모든 요소를 한번에 선택자로 지정하는 방법이다. *{ } -태그 선택자 html 태그명으로 선택자를 지정하는 방법이다. tagname{ } -id 선택자 id 속성값을 이용해 선택자를 지정하는 방법이다. #id 속성값{ } -클래스 선택자 class속성값을 이용해 선택자를 지정하는 방법이다. .class속성값{ } -기본 속성 선택자 HTML 태그에서 사용할 수 있는 속성과 값을 사용해 선택자를 지정하는방법이다. [속성]{/*css 코드*/} -문자열 속성 선택자 태그가 가진 속성값이 특정한 문자열과 일치하는 요소를 선택자로 지정하는 방법이다. 2. 조합 선택자 사용하기 -그룹선택자 여러 선택.. 2023. 3. 10. 3-2장 실무에서 자주 사용하는 HTML 필수 태그 다루기 공부할내용(82~127쪽) 1. form 태그 -form 태그는 폼 양식을 의미한다. -form 태그는 action과 method 속성을 함께 이용한다. -여기서 action 속성은 폼요소에서 사용자와 상호작용으로 입력받은 값들을 전송할 서버의 url 주소를 적는다. -method 속성은 입력받은 값을 서버에 전송할때 송신방식을 적는다. 2. input 태그 로그인 페이지의 아이디와 비밀번호처럼 입력받는 요소를 생성할때 사용한다. (형식) name 속성에는 입력 요소의 이름을 작성한다. (서버에서는 지정된 이름으로 입력요소를 식별 할 수 있다.) value 속성은 입력 요소의 초깃값을 작성한다. (예시) 3. label태그 label태그는 form 태그 안에서 사용하는 상호작용 요소에 이름을 붙일때 사용.. 2023. 3. 9. 3장 실무에서 자주 사용하는 HTML 필수 태그 다루기 공부할내용(60~81쪽) 1. hn 태그(n은 숫자) h는 heading을 나타내며 제목이나 주제를 나타낼때 많이 사용한다. Heading 1 Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 2. p 태그 태그는 본문의 문단을 작성할때 사용하며 본문에 많이 사용한다. paragraph는 문단의 약자입니다 3. br 태그 줄바꿈 할때 사용한다. br은 줄바꿈에 사용합니다. 4. blockquote 태그 출처에서 인용한 문단단위의 텍스트를 작성할때 사용한다. 인용 인용 인용~ 5. q태그 문단안에 텍스트 단위의 짧은 인용문을 작성할때 사용한다. 짧은 인용 인용~ 6. ins 태그와 del 태그 ins 태그는 추가된 텍스트를 나타낼때 del 태그는 삭제된 텍스트임을 나.. 2023. 3. 8. 2장 HTML 문서 작성을 위한 기본 내용 살펴보기 공부할 내용(46~57쪽) 1. HTML의 기본 구성 요소 2. HTML의 기본 구조 3. HTNL의 특징 파악하기 1. HTML의 기본 구성요소 - 태그 태그는 HTML 문법을 이루는 가장 작은 단위를 말한다. - 속성 태그에 어떤 의미나 기능을 보충하는 역할이다. 속성은 으로 구성된다. 위 사진에서 등이 예시이다. - 문법 콘텐츠가 있는 문법과 콘텐츠가 없는 문법으로 나뉜다. 콘텐츠가 있는 문법은 속성의 사진에서 Document이 해당되며 은 시작태그 Document는 콘텐츠 은 종료태그이다. 콘텐츠가 없는 문법은 : 줄바꿈 이 있다. - 주석 주석은 실행결과에는 표시되지 않지만 코드에 메모나 설명등을 넣고 싶을때 사용한다. 형식은 이다 코드 실행 결과 ++ 추가로 단축키인 Ctrl+k+c 로 원하는.. 2023. 3. 7. 1장 Hello, HTML + CSS + 자바스크립트 (~44p) 1. 홈페이지에서 코드 에디터를 설치한다. (Visual Studio Code 사용) https://code.visualstudio.com/ Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. code.visualstudio.com 2. 설치 후 자기가 사용 하고 싶은 확장프로그램을 설치한다... 2023. 3. 6. 이전 1 2 3 다음
