HTML 스타일
style 속성은 HTML 요소의 스타일을 변경합니다.
이 텍스트는 Verdana와 빨간색입니다 이 텍스트는 Times과 파란색입니다 이 텍스트는 30픽셀 높이입니다
HTML의 style 속성
style 속성의 역할:
모든 HTML 요소의 스타일을 변경하는 일반적인 방법을 제공합니다.
스타일은 HTML 4에서 도입되었으며, HTML 요소 스타일을 변경하는 새로운 선호하는 방법입니다. HTML 스타일을 통해 style 속성을 사용하여 직접 HTML 요소에 스타일을 추가하거나 독립된 스타일 시트(CSS 파일)에서 간접적으로 정의할 수 있습니다.
우리의 CSS 강의CSS에 대해 모든 지식을 배우세요.
우리의 HTML 강의에서는 style 속성을 사용하여 HTML 스타일을 설명할 것입니다.
사용하지 않는 태그와 속성
HTML 4에서는 여러 태그와 속성이 폐지되었습니다. 폐지(deprecated)는 미래의 HTML과 XHTML에서 이러한 태그와 속성을 지원하지 않을 것이라는 의미입니다.
이곳에서 전달하는 정보는 명확합니다: 이러한 폐지된 태그와 속성을 사용하지 마세요!
아래와 같은 태그와 속성을 피해야 합니다:
태그 | 설명 |
---|---|
<center> | 중앙 정렬된 내용 정의 |
<font>과 <basefont> | HTML 글꼴 정의 |
<s>과 <strike> | 삭제선 텍스트 정의 |
<u> | 밑줄 텍스트 정의 |
속성 | 설명 |
align | 텍스트 정렬 방식 정의 |
bgcolor | 배경색 정의 |
color | 텍스트 색상 정의 |
위와 같은 태그와 속성에 대해: 스타일을 사용하도록 하세요!
HTML 스타일 예제 - 배경색
background-color 속성은 요소에 배경색을 정의합니다:
<html> <body style="background-color:yellow"> <h2 style="background-color:red">이것은 헤더입니다</h2> <p style="background-color:green">이것은 구절입니다.</p> </body> </html>
style 속성은 "고유한" bgcolor 속성을 대체했습니다.
HTML 스타일 예제 - 글꼴, 색상 및 크기
font-family, color 및 font-size 속성은 각각 요소의 텍스트의 글꼴 시리즈, 색상 및 글자 크기를 정의합니다:
<html> <body> <h1 style="font-family:verdana">하나의 헤더</h1> <p style="font-family:arial;color:red;font-size:20px;">하나의 구절.</p> </body> </html>
style 속성은 고유한 <font> 태그를 대체했습니다.
HTML 스타일 예제 - 텍스트 정렬
text-align 속성은 요소의 텍스트 수평 정렬 방식을 정의합니다:
<html> <body> <h1 style="text-align:center">이것은 헤더입니다</h1> <p>이 페이지의 상단 헤더는 중앙 정렬되었습니다.</p> </body> </html>
style 속성은 고유한 "align" 속성을 대체했습니다.