<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>표 스타일 다양하게 적용하기 </title>
<style>
.various {
list-style-type:none;
font-size:24px; line-height:2.0;
}
.one-color {
color:#ad3000;
}
</style>
</head>
<body>
<h1>최신 웹 디자인 트렌드</h1>
<ul class="various">
<li><span class="one-color">반응형 웹디자인</span>-다양한 화면 크기에 최적화하다.</li>
<li><span class="one-color">플랫 디자인</span>-입체에서 평면으로</li>
<li><span class="one-color">풀 스크린 배경</span>-콘텐츠에 집중</li>
<li><span class="one-color">원 페이지 사이트</span>-한 페이지에 모든 내용을 담다.</li>
<li><span class="one-color">패럴랙스 스크롤링</span>-동적인 효과로 강한 인상을!</li>
<li><span class="one-color">웹 폰트</span>-웹 타이포그래피를 받쳐 주는 기술</li>
</ul>
</body>
</html>
결과 :표 스타일 다양하게 적용하기
'css' 카테고리의 다른 글
| 7장 마무리 문제 3 (0) | 2023.03.26 |
|---|---|
| 7장 마무리 문제 2 (0) | 2023.03.26 |
| 7장 예제 - 표 스타일 다양하게 적용하기 (0) | 2023.03.26 |
| 7장 실습-목록을 사용하여 세로 메뉴 만들기 (0) | 2023.03.25 |
| 6장 마무리 문제 2 (0) | 2023.03.24 |