웹2.0을 배우는 블로그

유튜브 무료코딩강좌 무작정 따라하기

단락과 단락의 여백을 주는 < p></p>태그 유튜브 동영상 코딩콩부

코딩공부 html https://atom.io/  애플리케이션 설치

코딩연습 의미없는 글자 복사 붙여넣기 <p></p>단락태그 연습

<h1>W3C</h1>

Hypertext Markup Language  (HTML) is the standard markup

language for <strong> cascading <u>web</u> pages</strong>

and web applications. Web browsers receive HTML documents from

a web server or from local storage and render them into

multimedia web pages. HTML describes the structure of a web page

semantically and originally included cues for the appearance

of the documents. 

HTML elements ard the building blocks of HTML pages. With HTML

 comstructs, images and other objects, such as interactive 

forms to create structured documents by denoting structural semantics 

for tdxt such as headings, paragraphs, lists, links, quotes and other items.

 HTML elements are delineated by tags, Written using algle brackets.

어플리케이션에서 단락을 띄어 여백을 두었지만

 웹페이지에서는 간격이 떨어지지 않은 채로 보여지게 되는데

이는 줄간격을 띄어주는 <br>태그를 사용하거나

<p></p>단락을 띄어 여백을 주는 단락태그를 사용하여 

정리할 수 있다, <p></p>태그 코딩공부

줄간격을 띄어주는 <br><br>태그를 2번 적용하고 

Ctrl+S 저장한다

<br><br> 줄간격 태그를 Ctrl+S 저장 한 후

Ctrl+O 단축키로 웹페이지를 불러와 확인하면 단락태그 <p></p>를 

적용한 것 처럼 문장에 여백을 줄 수 있다, 

<br>태그는 사용하는 만큼 여백을 늘릴 수 있다 

<br><br><br> 줄간격 태그를 3번 적용하고 Ctrl+S 저장

<br><br><br> 줄바꿈태그를 3번 적용했을 때 문장과 문장 사이

단락의 여백이 더 벌어진 것을 확인할 수 있었다

 정해진 여백만큼 간격을 띄어 주는 <p></p>를

적용하고 단축키 Ctrl+S 저장

 정해진 여백만큼 간격을 띄어 주는 단락태그

<p></p>를 적용했을 때 

여백과 여백의 사이를 더 정교하게 나타내 주는

CSS 코드 <p style="margin-top:40px;"> 수치만 바꿔주면

더 정교하게 단락의 여백을 조절할 수 있다

CSS 여백과 여백의 사이를 더 정교하게 조절할 수 있는

CSS 코드 <p style="margin-top:45px;">적용

CSS 코드 <p style="margin-top:100px;">적용

단락의 여백을 마음대로 바꿀 수 있다

태그와 태그 사이의 여백을 표시해주는

<p style="margin-left:50px;">CSS 코드를 문장 좌측의 

여백을 적용하고 Ctrl+S 저장했다

<p style="margin-left:50px;">CSS 코드를 저장하고

Ctrl+O 단축키로 웹페이지에서 확인해 보니 태그와 태그 사이에 입력된

 <p style="margin-left:50px;">코드로 왼쪽 여백이 적용됐다