반응형
|
HTML address 태그 이용해서 제작자, 주소, 연락처 입력하기 |
|
환경: Eclipse Mars |
일반적으로 웹 페이지 하단에 보면 사이트를 알리는 주소와 연락처, Copyright 등이 들어갑니다. 아래 그림처럼 티스토리에는 메뉴도 들어가 있습니다. 이렇게 HTML 에는 하단에 정보를 표기할 때 사용되는 <address> 태그가 있습니다. 폰트는 기본 크기이며, 자동으로 이텔릭체와 텍스트 기울기가 적용됩니다. 좀더 세심하게 변경하고 싶다면 CSS 로 적용하면 되겠지만 <address> 태그만으로도 정보 표현이 가능하기 때문에 많이 이용합니다.
▼ 사이트 하단에 보시면 주소나 연락처, Copyright 등이 있는데 티스토리 블로그는 아래 그림과 같이 주요 메뉴들이 위치하고 있네요. 티스토리 블로그에 address 태그가 쓰인 것은 아니지만 보통 아래 위치의 텍스트에 적용합니다.
▼ 아래 샘플은 address 태그로 티스토리 블로그 하단에 쓰인 메뉴와 문구에 적용해 보았습니다. 그리고 <hr> 태그로 본문과 구분을 지어 주었습니다. 결과는 이텔릭체와 기울기가 적용되었습니다. 여기에 CSS 를 이용해서 폰트를 조금 줄였습니다.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="euc-kr">
<title>HTML 태그</title>
<style type="text/css">
body {
background-color: #e7e7e7;
}
#address1 {
font-size:13px;
}
</style>
</head>
<body>
<p>녹두장군 블로그는 모든 IT 지식을 공유하고 나누는 장입니다.</p>
<hr/>
<address id="address1">
지역로그 : 태그로그 : 미디어로그 : 방명록 : 관리자 : 글쓰기<br/>
녹두장군's Blog is powered by Daum / Designed by Tistory
</address>
</body>
</html>
반응형
'웹 프로그래밍 > HTML' 카테고리의 다른 글
| HTML 입력양식 input 태그 HTML5 추가된 속성에 대한 설명 (1) | 2019.04.11 |
|---|---|
| HTML 하이퍼링크 텍스트의 색상 상태에 따라 별도 지정하기 (0) | 2019.01.14 |
| HTML 이미지 관리를 위한 img 태그 기본적인 내용 (0) | 2019.01.03 |
| HTML 순서 없는 목록 만들기 ul, li 태그 사용법 (0) | 2018.10.31 |
| 스타일 시트 CSS 글자의 두께를 조절하는 font-weight 사용하는 방법 (0) | 2018.06.06 |
| HTML 텍스트 입력할 때 이용되는 태그들 사용법 (0) | 2018.05.02 |
| HTML 텍스트 크기를 조절하는 제목 태그 Hn 사용하기 (0) | 2018.03.20 |
| HTML 특수문자 출력, 공백을 적용할 수 있는 코드 (0) | 2018.03.02 |
