<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>css의 주요속성</title>
<style>
/*
h1,input과 같은 코드를 선택자(selector)라고 한다.
디자인을 적용할 대상을 지정하는 역할을 한다.
주요속성
- color : 글자 색상
- background-* : 배경 속성(이미지, 색상)
- font-* : 글꼴 속성
- padding-* : 내부 여백 속성
- margin-* : 외부 여백 속성
- px 또는 em 사용 가능
- em은 글자에 비례한 크기
- border-* : 테두리 속성
*/
h1{
color: brown;
background-color: blanchedalmond;
font-size: 50px;
padding: 0.5em;
}
input{
font-family: 빙그레 메로나체,sans-serif;
font-size: 50px;
padding: 1%;
border-top: none;
border-right: none;
border-left: none;
}
</style>
</head>
<body>
<h1>hello CSS</h1>
<input type="text" value="hello CSS!">
</body>
</html>
'CSS' 카테고리의 다른 글
| 2차 메뉴에 대한 디자인 구현 (0) | 2023.08.29 |
|---|---|
| 폰트 어썸을 이용해보자! (2개다 사용해볼것) (0) | 2023.08.28 |
| 아이콘 사용법(Font Awesome) (0) | 2023.08.28 |
| html 인라인 태그 (0) | 2023.08.23 |
| html 인라인 스타일 (0) | 2023.08.23 |