본문 바로가기

온라인 강의/CSS

CSS 주요 속성 1

  • widthheight – 요소의 넓이와 높이를 설정합니다.

.paragraph { width: 500px; height: 500px; }

 

 

font- – 글자 크기, 글꼴, 두께 등, 글자와 관련된 속성을 설정합니다.

.paragraph { font-size: 50px; font-family: Arial, sans-serif; font-style: italic; font-weight: bold; }

 

<body> 안에서 <h1>를 사용해 Nice to meet you를 출력합니다.

<style> 태그 안에서 클래스 이름을 호출하고, .paragraph의 넓이, 높이, 배경색, 그리고 글자 속성을 결정합니다.

width, height, background-color, font- 속성을 이용해 .paragraph 클래스의 넓이와 높이, 배경색 그리고 글꼴을 설정해봅시다!

 

 

  1. .paragraph의 넓이와 높이를 500px로 설정합니다.
  2. 배경색은 green으로 설정합니다.
  3. 폰트는 크기 50px, 굵게, 이탤릭체로 설정합니다. 글꼴은 Times, Arial, sans-serif로 설정합니다.

 

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>CSS 주요 속성 1</title>
 
  <style>
    .paragraph {width: 500px; height:500px; font-size: 50px; background:green;  font-size:50px; font-weight:bold; font-style:italic; font-family:Times, Arial, sans-serif}
  </style>
 
</head>
<body>
 
  <h1 class="paragraph">Nice to meet you</h1>
 
</body>
</html>

 

 

 

 

 

 

 

 

 

'온라인 강의 > CSS' 카테고리의 다른 글

CSS 주요 속성 2  (0) 2023.04.13
CSS속성의 상속  (0) 2023.04.13
CSS 선택자  (0) 2023.04.13
CSS 연동 방법  (0) 2023.04.13