HTML 속성을 사용하는 방법 이 텍스트는 40픽셀 및 녹색입니다.

HTML 속성을 사용하는 방법 이 텍스트는 40픽셀 및 녹색입니다.

2022-06-01 last update

6 minutes reading HTML Spin Up
HTML 속성은 HTML 요소의 색상, 크기 및 기타 특성을 변경하는 데 사용됩니다.예를 들어, 속성을 사용하여 텍스트 요소 글꼴의 색상이나 크기를 변경하거나 이미지 요소의 너비와 높이를 변경할 수 있습니다.이 강좌에서는 HTML 속성을 사용하여 HTML 텍스트 요소의 크기와 색상 속성의 값을 설정하는 방법을 배울 것입니다.
HTML 속성은 다음과 같이 열린 태그에 배치됩니다.
<element attribute="property:value;">
흔히 볼 수 있는 속성은 style 입니다. HTML 요소에 스타일 속성을 추가할 수 있습니다.HTML 문서의 스타일을 결정하는 데는 별도의 스타일시트를 사용하는 것이 일반적이지만, 이 강좌에서는 HTML 문서의 스타일 속성을 사용합니다.

스타일 속성 사용


우리는 스타일 속성을 사용하여 요소의 여러 속성을 변경할 수 있습니다."index.html"파일을 지우고 브라우저에 다음 코드를 붙여넣습니다.(이 강좌 시리즈를 배우지 않으셨다면 저희 강좌 Setting Up Your HTML Project 에서 설정 <h1> 파일에 대한 설명을 보실 수 있습니다.
<h1 style="font-size:40px;color:green;">This text is 40 pixels and green.</h1>
브라우저에 파일을 로드하기 전에 HTML 요소의 각 부분을 살펴보겠습니다.
  • index.html는 레이블의 이름입니다.이것은 최대 치수의 제목 요소를 가리킨다.
  • h1은 속성입니다.이 속성은 여러 가지 다른 속성을 가질 수 있습니다.
  • style은 우리가 font-size 속성에 설정한 첫 번째 속성이다.
  • style는 속성40px;의 값으로 요소의 텍스트 내용을 40픽셀로 설정합니다.
  • font-size은 우리가 color 속성을 위해 설정하고 있는 두 번째 속성이다.
  • style는 속성green의 값으로, 텍스트 내용 색을 녹색으로 설정합니다
  • 속성과 값은 따옴표에 포함되며, 각각color쌍은 세미콜론property:value으로 끝납니다.
    파일을 저장하고 브라우저에서 다시 로드합니다.(브라우저에서 파일을 로드하는 방법에 대한 자세한 내용은 우리tutorial here를 참조하십시오.)다음을 수신해야 합니다.

    이 텍스트는 40픽셀 및 녹색입니다.


    텍스트 요소의 글꼴 크기와 글꼴 색상을 변경할 때 ; 속성을 사용하는 방법을 배웠습니다.일부 요소는 속성이 필요합니다. 예를 들어 style 요소는 텍스트나 이미지에 링크를 추가할 수 있고, <a> 요소는 문서에 이미지를 추가할 수 있습니다.다음 강좌에서 이 두 요소를 소개하고 이 강좌의 뒷부분에서 <img> 용기와 다른 HTML 요소의 다른 속성 사용법을 이해할 것입니다.