> 웹 프론트엔드 > HTML 튜토리얼 > HTML에서 DIV를 사용하는 방법

HTML에서 DIV를 사용하는 방법

php中世界最好的语言
풀어 주다: 2017-11-22 17:51:09
원래의
8369명이 탐색했습니다.

Div는 HTML 웹 페이지에서 일반적으로 사용되는 태그입니다. 기본 스타일은 별도의 줄을 차지하는 것입니다. DIV를 생성하는 경우 해당 CSS 스타일을 다시 할당해야 합니다. div 너비 및 높이, 내부 글꼴 크기, 글꼴 색상 등의 스타일 설정은 모두 CSS를 통해 구현되어야 합니다.

div에 대한 대중적인 이해는 div의 기능이 레이아웃 구현, 콘텐츠 스타일 제어, 다양한 레이아웃 효과 달성이라는 것입니다.

DIV 사용 예. 여기에서는 div에 다양한 CSS 스타일을 설정하여 효과를 관찰할 수 있습니다.

예제의 전체 HTML 소스 코드:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="gb2312" /> 
<title>div的用法在线演示 www.php.cn</title> 
<style> 
div{ margin-top:10px}/* css注释说明:对div都设置上间距10px */ 
.div-1{font-size:16px}/* 设置css字体大小16px */ 
.div-2{color:#F00}/* 设置css字体颜色为红色 */ 
.div-3{ background:#000; color:#FFF}/* 设置CSS背景颜色为黑色和字体颜色为白色 */ 
.div-4{ border:1px solid #F00; height:60px}/* 设置css边框和CSS高度60px */ 
</style> 
</head> 
<body> 
<div>普通内容一</div> 
<div class="div-1">我字体大小为16px</div> 
<div class="div-2">我字体颜色为红色</div> 
<div class="div-3">我背景为黑色字体为白色</div> 
<div class="div-4">布局设置边框和高度</div> 
</body> 
</html>
로그인 후 복사

DIV의 용도가 너무 많습니다. 더 흥미로운 콘텐츠를 보려면 PHP 중국어 웹사이트에서 다른 관련 기사를 주목하세요!

관련 읽기:

html에서 앵커 텍스트를 작성하는 방법

html에서 주석의 역할은 무엇입니까

ie6은 hover를 지원합니까?

위 내용은 HTML에서 DIV를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿