HTML Wrap-Up


HTML 기초 용어

  • tag
  • content
  • element
  • attribute
element = <tag element> content </tag>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>repl.it</title>
</head>

<meta name="viewport" content="width=device-width">:
디바이스의 가로 크기가 곧 웹 페이지의 가로와 같다는 의미.
모바일에서 웹사이트가 예쁘게 잘 보이려면 추가해야 하는 정보.
해당 정보를 추가하지 않으면 데스크탑 버전의 웹페이지가 축소되어 보이는 현상


<span><p>의 차이

<span> : 줄바꿈이 불가능한 inline-element
<p> : 줄바꿈이 가능한 block-element

<span> My </span> 
<span> Munequita </span>

<!-- Print: My Munequita -->


<p> My </p>
<p> Munequita </p>

<!-- Print: My -->
<!-- Print: Muneqiuita -->

<id><class> 의 차이

<id> : 중복된 id 이름 생성 불가
<class> : 중복된 class 이름 생성 가능

<div id="name"> 
  <p> Smooth </p> 
</div>

<div class="lyric"> 
  <p> And it's just like the ocean </p>
</div>

<div class="lyric">
  <p> under the moon </p>
</div>



Take Away

HTML 정리와 wrap-up

Replit HTML 과제를 공부하면서 내가 정리가 필요했던 부분들을 적었다.
이렇게 하루의 일과를 마치고 블로깅을 하면서 내 스스로 정리가 필요했던 부분들을 적어나가는 것도 좋은 것 같다.
내가 나중에 이걸 다시 볼 지는 모르겠지만, 적어도 하루를 마무리하는 과정에서 이런식으로 적으며 wrap-up을 한다면 기억에 조금이라도 더 오래 남을 수 있지 않을까 싶다.

profile
으악

0개의 댓글

Powered by GraphCDN, the GraphQL CDN