Mom's Beauty Routine

Front-end (4)

body에 글 작성하기 heading h1~h6, p, em, strong

카테고리 : Front-end/HTML why. P | 2022. 7. 9. 07:00

지난 시간까지 HTML의 기본구조와 Semantic Tag에 대해 공부했습니다. 이번에는 body 안에 글을 쓰기 위해 사용되는 태그에 대해 공부해보고 합니다. 우리가 한글이나 엑셀 등의 프로그램을 활용하여 글을 쓸 때를 생각해볼꼐요. 제목, 내용, 소제목, 내용을 반복하게 됩니다. 이중 중요하다고 생각되는 부분에는 굵게 표기하기도 하고 기울임을 사용하기도 합니다. 프로그램을 활용하면 버튼과 단축키로 해결되지만 HTML에서는 태그를 사용하여 작성되어야 합니다. HTML 글쓰기 위의 글을 위키백과의 HTML 관련 일부분을 발췌한 글입니다. 위의 글을 보고 heading Tag과 p 태그 등을 공부해 보도록 하겠습니다. 1. heading heading Tag는 ~ 까지 이루어져 있습니다. 위은 ~ 까지를 ..

HTML의 구조와 Semantic HTML

카테고리 : Front-end/HTML why. P | 2022. 7. 7. 07:00

HTML은 HeyperText Markup Language로 Web page의 골격 역할을 합니다. 오늘 공부해볼 내용은 HTML의 구조는 어떻게 설정되며 이 구조 사이에서도 의미를 가지고 있는 Tag를 알아보고자 합니다. Semantic Tag(의미있는)를 사용하는 이유는 검색엔진에 최적화하기 위해서이기도 하고 개발자 간 확인이 쉽게 하기 위하여 사용하는 Tag를 말합니다. HTML 구조 HTML은 아래와 같은 구조로 만들어져 있습니다. See the Pen HTML구조 by Why Price (@why-price) on CodePen. 1. 선언문 선언문은 HTML 페이지의 첫번째 줄에 표시되어야 하며 문서에 사용되는 HTML의 버전과 예상되는 문서를 브라우저에 알려주는 역할을 합니다. 또한 호환성을..

코딩 블로그 codepen 작성코드 넣기

카테고리 : Front-end why. P | 2022. 7. 5. 07:00

코딩 공부를 하기 위해 블로그에 글을 쓰고 계신 분들이 많을 것이라고 생각합니다. 저 또한 공부한 것을 정리하기 위해 블로그에 오늘도 글을 쓰고 있습니다. 블로그에 코드를 정리하고 예제 코드를 작성하였을 때 실제로 실행되는 모습이 안 보일 경우 작성된 코드만 보고 어떤 모습일지 상상이 되시나요? 아직도 코드를 작성하고 결과를 캡처하면서 정리하고 계신가요? 오늘은 작성된 코드의 모습을 확인 할 수 있는 방법을 알려드리고자 합니다. 방법은 바로 codepen을 활용하여 코드를 작성하고 작성된 코드와 결과 화면을 블로그에 넣는 방법에 대해 알아보고자 합니다. CODEPEN 블로그에 넣기 1. codepen 회원가입 내가 작성한 코드를 저장하기 위해서는 codepen에 회원가입을 해야합니다. 회원가입을 하지 않..

프론트 앤드(Front-end) 독학 준비하기

카테고리 : Front-end why. P | 2022. 7. 4. 18:43

최근 프런트 앤드에 대한 관심이 생기면서 공부를 하고 있습니다. 이젠 나이가 있어서 그런지 공부하고 돌아서면 잊어버리는 일이 많아지네요. 오늘부터 독학을 준비하면서 습득한 정보와 공부한 내용을 조금이나마 블로그에 작성하여 복습하는 과정을 가져보려고 합니다. 우선 프론트앤드(Fornt-end)란 무엇일까요? 쉽게 생각하면 우리가 접할 수 있는 웹과 앱의 앞면이라고 생각하면 좋을 것 같습니다. 웹의 구조, 꾸밈, 동작 등 눈앞에 보이는 것이 프런트 앤드의 작업입니다. 작업하면서 실시간으로 확인할 수 있어 큰 매력이 있는 것 같아요. 프런트 앤드를 독학하려면 어떻게 해야 할까요? 공부하기 좋은 사이트 1. Codecademy 현재 제가 공부하고 있는 사이트입니다. HTML, CSS, JavaScript의 기본..

Copyright © Mom's Beauty Routine All Rights Reserved

Designed by JB FACTORY

티스토리툴바