简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
집 > 웹 프론트엔드 > HTML 튜토리얼 > 본문

div垂直水平居中实例代码_html/css_WEB-ITnose

WBOY
풀어 주다： 2016-06-24 11:31:11
원래의
1071명이 탐색했습니다.

div垂直水平居中实例代码:
关于让div垂直水平居中的效果太多了，这里就不介绍了，废话不多说，直接给出代码。
代码实例如下:

<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="author" content="http://www.softwhy.com/" /><title>垂直水平居中代码</title><style type="text/css">body {  background-color:#e1ddd9;  font-size:12px;  padding:0px;  margin:0px;}#inhalt {  position:absolute;  height:200px;  width:400px;  margin:-100px 0px 0px -200px;  top:50%;  left:50%;  text-align:left;  padding:0px;  background-color:#f5f5f5;  border:1px dotted #000000;  overflow:auto;}</style></head><body><div id="inhalt"></div></body></html>
로그인 후 복사

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=9808

更多内容可以参阅:http://www.softwhy.com/divcss/

관련 라벨：
div垂直水平居中实例代码
원천：php.cn
이전 기사：HTML表单_html/css_WEB-ITnose 다음 기사：HTML文本级元素_html/css_WEB-ITnose
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
그리드 템플릿 영역을 사용하여 그리드를 표시하는 것이 작동하지 않는 이유는 무엇입니까? 그리드 템플릿 영역을 통해 요소 배열을 얻으려고 하는데 작동하지 않습니다. 블록을 수직, 수평으로 배열하기 위해 그리드 시스템을 사용하려고 합니다. 왼쪽의 그림과...
에서 2023-09-09 16:28:13
0
1
279
여러 헤더 셀에서 첫 번째 div의 세로 위치 정렬 여러 div, 첫 번째 헤더 셀 내부에 여러 div, 두 번째 헤더 셀 내부에 단 하나의 div가 포함된 요소가 있습니다. 아래 코드를 실행하면 "123...
에서 2023-09-06 10:15:16
0
1
277
place-content: center를 사용하는 전체 너비 CSS 그리드 항목 다음과 같이 CSS 그리드의 place-content:center를 사용하여 고정 컨테이너에서 div를 수직 및 수평으로 중앙에 배치했습니다. {패딩:30px;배...
에서 2023-09-05 17:54:47
0
2
227
Nuxt 3에서 <html> 및 <body> 태그에 Tailwind CSS 클래스를 추가하는 방법은 무엇입니까? 내 Nuxt3 애플리케이션에 tailwind를 사용하여 사용자 정의 404 오류 페이지를 만들려고 합니다. 페이지가 모든 장치의 화면을 채우고 404 오류 페이지...
에서 2023-09-04 19:20:05
0
1
315
div 블록 내에서 텍스트를 가로 및 세로 가운데에 배치하는 방법은 무엇입니까? adivsettodisplay:block(90pxheightandwidth)이 있고 내부에 텍스트가 가운데에 있고 가로로 정렬되어야 합니다. text-align:...
에서 2023-08-24 16:58:26
0
2
276
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！