2021.3.6 토요일

gigymi2005·2021년 3월 7일
0

Daily_Log

목록 보기
7/42
post-thumbnail

🚩 오늘 공부량

공부내용

생활코딩(WEB1- HTML & Internet) 기본문법 태그(5강) ~ 원시웹(16강)

공부시간

2시간 33분


📖 오늘 배운내용

📄 strong태그

🎨__특징__

  • strong 태그는 매우 중요한 텍스트를 정의하는 데 사용된다.
  • 내부의 텍스트는 진하게 표시된다.

👀__마크다운 작성시__

이렇게 특정한 텍스트를 <strong>굵게</strong> 쓸 수 있다.

👉__결과__

이렇게 특정한 텍스트를 굵게 쓸 수 있다.


📄 u 태그

🎨__특징__

  • u 태그는 내부의 텍스트를 밑줄로 표시한다.
  • 하이퍼 링크에 혼동될 수 있는 요소를 사용하지 않는다.

👀__마크다운 작성시__

이렇게 특정한 텍스트를 <u>밑줄을</u> 그어줄 수 있다.

👉__결과__

이렇게 특정한 텍스트를 밑줄을 그어줄 수 있다.


📄 h1~6 태그

🎨__특징__

  • HTML 제목을 정의하는데 주로 사용한다.
  • h1부터 h6까지 있고 번호가 높아질수록 크기가 작아진다.

👀__마크다운 작성시__

<h1>제목</h1>
<h2>제목</h2>
<h3>제목</h3>
<h4>제목</h4>
<h5>제목</h5>
<h6>제목</h6>

👉__결과__

제목

제목

제목

제목

제목
제목

📄 br 태그

🎨__특징__

  • 텍스트 줄바꿀때 사용한다.
  • 종료 태그가 없다.

👀__마크다운 작성시__

안녕하세요.<br>저의 꿈은 계속발전하는 개발자가 되는 것입니다.<br>앞으로 블로그에 매일 공부한 내용을 정리해서 올리겠습니다.

👉__결과__

안녕하세요.
저의 꿈은 계속발전하는 개발자가 되는 것입니다.
앞으로 블로그에 매일 공부한 내용을 정리해서 올리겠습니다.


📄 p 태그

🎨__특징__

  • paragraph의 약자로 하나의 문단을 만들때 사용합니다.

👀__마크다운 작성시__

<p>안녕하세요.<br>저의 꿈은 계속 발전하는 개발자가 되는 것입니다<br>앞으로 블로그에 매일 공부한 내용을 정리해서 올리겠습니다.</p><p>이런식으로 새로운 문단을 시작해 글을 쓸 때 사용합니다.</p>

👉__결과__

안녕하세요.
저의 꿈은 계속 발전하는 개발자가 되는 것입니다
앞으로 블로그에 매일 공부한 내용을 정리해서 올리겠습니다.

p 태그는 이런식으로 새로운 문단을 시작해 글을 쓸 때 사용합니다.


📄 img태그와 속성

🎨__특징__

예시)

> ***
>- img 태그는 HTML페이지에 이미지를 포함하는데 사용된다.
>
>- 예시에서 src랑 width를 속성이라 하고 "~~"안에 있는 값을 속성값이라고 한다.
>- 속성의 위치는 개수는 상관없다 .
>- 속성은 태그이름만으로 정보가 부족할때 사용한다.

👀__마크다운 작성시_
```html
<img src="https://images.unsplash.com/photo-1555066931-4365d14bab8c?ixid=MXwxMjA3fDB8MHxzZWFyY2h8Nnx8Y29kaW5nfGVufDB8fDB8&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" width="500"

👉결과


📄 부모자식관계인 ol,ul태그와 li태그

🎨__특징__

예시)

  1. HTML
  2. CSS
  3. JavaScript
``` > *** >- 태그가 포함관계로 연결되어 있을 때 포함한 태그를 '부모태그' 포함된 태그를 '자식 태그'라고 한다 >- ol은 'ordered list'의 약자로 li의 순서를 나타낼 수 있다. >- ul은 'unordered list'의 약자로 li를 순서없이 나열할 때 사용한다. >- 부모자식이 짝궁으로 쓰이는 다른 대표적인 예시의 태그는 table이 있다.

👀__마크다운

<ol>
    <li>HTML
    <li>CSS
    <li>JavaScript
</ol>
<ul>
    <li>HTML
    <li>CSS
    <li>JavaScript
</ul>

👉__결과__

  1. HTML
  2. CSS
  3. JavaScript
  • HTML
  • CSS
  • JavaScript

📄 가장 많이 쓰이는 태그들

🎨__특징__

예시)

<meta charset='utf-8'> </head> <body> <body/> ``` >*** >- doctype 선언은 html태그를 정의하기전에 선언되어야만 한다. >- doctype 선언은 HTML태그는 아니지만, 선언된 페이지의 HTML버전이 무엇인지를 웹 브라우저에 알려주는 역할을 한다. >- head태그 안에는 본문을 설명하는 태그, body 태그 안에는 본문에 쓰이는 태그를 사용한다. >- title 태그는 웹에 이름(제목)을 설정한다. >- meta 태그는 utf로 파일을 불러오게 설정한다. 📄 a 태그

🎨__특징__

  • a 태그는 링크를 만들어서, 한 페이지에서 다른 페이지로 연결하는데 사용한다.
  • 기본적으로 밑줄과 파랑색으로 표시된다.
  • 많이 쓰이는 속성으로는 href, target, title 이 있다.
  • href 속성값에는 이동하고 싶은 주소를 쓰면 된다.
  • target 속성값 중 가장많이쓰이는 _blank 는 링크된 문서가 새로운 윈도우나 탭에서 오픈하게 만듭니다.
  • title 속성을 쓰면 링크에 마우스를 올려놓으면 툴팁울 뜨게 할 수 있다.

👀__마크다운__

 <a href="https://github.com/" target="_blank" title="깃허브 바로가기">깃허브</a>

👉__결과__

깃허브


🤷‍♂️ 느낀점

처음 공부한 것을 정리해가면 블로그에 써봤는데 처음이라 그런지 너무 힘들었다. 그래도 어제는 정리하다가 포기했는데 오늘이라도 포기하지 않고 정리한 내가 대견하다. 공부는 에전에 html을 한번 배운적이 없어 크게 이해가 안되는 것은 없었지만 예전에 긴가민가 했던것들을 머리속에 확실히 정리했다는데에 의의가 있는거 같다.

profile
개발자가 되기위해 공부하는 학생입니다.

관심 있을 만한 포스트

0개의 댓글