728x90
<a></a>
하이퍼링크 걸어주는 태그
1) 사용방법
<a href="https://yeon960.tistory.com">성연이의 티스토리</a>
>> 요소(element)
<a href="https://yeon960.tistory.com">성연이 티스토리</a>
>> 속성(attribute)
href
>> 속성의 값
"https://yeon960.tistory.com"
<html>
<body>
<a href="https://yeon960.tistory.com">성연이의 티스토리</a>
<a href="https://lsy2384.tistory.com">선영이의 티스토리</a>
</body>
</html>
<h1~h6></h1~h6>
글씨 크기를 조절하는 것으로 원하는 태그 사용 가능
<body>
<h1>난 성연</h1>
<h2>난 성연</h2>
<h3>난 성연</h3>
<h4>난 성연</h4>
<h5>난 성연</h5>
<h6>난 성연</h6>
</body>
<p></p>
문단 나누기
<body>
<p>
난 첫번째야
</p>
<p>
나는 두번째
</p>
</body>
<br>
p태그 없이 문단을 나눌 때 사용하는 방법
<body>
<a href="https://yeon960.tistory.com">성연이의 티스토리</a>
<br>
<a href="https://lsy2384.tistory.com">선영이의 티스토리</a>
</body>
<body></body>
br이나 p없이 원하는 문장을 원하는 형태로 출력 가능
<body>
<pre>
안녕? 나는 html을 배우는 성연이야
너는 내 블로그에 왜 왔니?
</pre>
</body>
ol(Ordered List)
순서있는 리스트로 자동으로 앞에 숫자가 붙음
<body>
<ol>
<li>일</li>
<li>이</li>
<li>삼</li>
<li>사</li>
<li>오</li>
</ol>
</body>
ul(Unordered List)
순서있는 리스트로 숫자가 아닌 마크가 붙음
<body>
<ul>
<li>아파치</li>
<li>엔진엑스</li>
<li>톰캣</li>
</ul>
</body>
Img(Image)
<body>
<img src="./images/a.jpg" alt="">
<img src="/jsstudy/images/a.jpg" alt="">
</body>
1) <img src="./images/a.jpg" alt="">
상대경로
2) <img src="/jsstudy/images/a.jpg" alt="">
절대경로
3) 경로 잘못
<img src="" alt="이미지 경로 잘못되었어">
4) 사진의 크기조절 가능
<img src="/jsstudy/images/a.jpg" width = 400 height= 500 alt="">
5) pdf문서 넣기
>> 버튼 누르면 이미지 보이기
<a href="/jsstudy/images/a.jpg"> a태그는 pdf문서도 올 수 있어~ </a>
>> 버튼 누르면 이미지 다운로드
<a href="/jsstudy/images/a.jpg" download="옥진욱"> a태그는 다운로드도 할 수 있어~ </a>
<hr>
수평선 긋기
 
띄어쓰기는 아무리해도 한 칸 밖에 반영이 안 됨 ->  를 사용해 띄어쓰기
<body>
<li>아 쿠</li>
<li>한 번</li>
<li>두 번</li>
<li>세 번</li>
<li>네 번</li>
</body>
< >
HTML에서< >는 태그로 인식 되어지므로 '<>'를 출력하기 위해서는 ' < >'을 사용하여 출력한다.
<li>아< >쿠</li>
'화면구현 > HTML' 카테고리의 다른 글
HTML 기본 컴포넌트 (0) | 2020.06.18 |
---|---|
HTML Scrip (0) | 2020.06.17 |
HTML div태그 (0) | 2020.06.17 |
HTML 테이블태그 (0) | 2020.06.17 |
HTML(Hyper Text Markup Language) 살짝 알아보기 (0) | 2020.06.17 |