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

HTML 텍스트와 이미지를 중앙에 배치하는 방법은 무엇입니까? 센터링 코드란 무엇입니까?

云罗郡主
풀어 주다： 2018-11-02 15:09:58
원래의
53500명이 탐색했습니다.

HTML 텍스트와 이미지를 중앙에 배치하는 방법은 무엇입니까? 센터링 코드란 무엇입니까? CSS를 이제 막 배우신 많은 분들이 이런 질문을 가지실 거라 믿습니다. 아래에 정리해 보겠습니다. 현재 최신 버전의 HTML(HTML5)은 "center" 태그를 지원하지 않으므로 HTML5 문서에서 텍스트를 중앙에 배치하려면 CSS 스타일 형식을 사용해야 합니다.

1: HTML 텍스트를 중앙에 배치하는 방법은 무엇입니까? [추천 학습: Html5 Tutorial]

1. HTML 문서를 열고 HTML 문서를 두 번 클릭하여 컴퓨터의 기본 텍스트(또는 HTML) 편집기에서 엽니다. 가운데에 배치할 텍스트, 단락 또는 기타 텍스트를 찾으면 텍스트에 "center" 태그를 추가합니다. 구문은

test
입니다. 여기서 "test"는 텍스트입니다. 텍스트에 레이블이 있는 경우(예: 단락 텍스트가 "

p>") "center" 레이블은 기존 레이블 이상으로 확장될 수 있습니다.

코드 예: 

<DOCTYPE html> 
<html> 
<body>
<h1><center>欢迎来到我的网站</center></h1> 
<center>php中文网</center > 
<p1>本网站的目的是php在线学习</p1>
</body> 
</html>
로그인 후 복사

코드 표시 효과:

HTML 텍스트와 이미지를 중앙에 배치하는 방법은 무엇입니까? 센터링 코드란 무엇입니까?

2: HTML에서 그림을 중앙에 배치하는 방법은 무엇입니까?

새 요소를 만들고 요소를 중앙에 배치합니다. 이 중앙 요소 내에 이미지를 포함할 수 있습니다. 그러나 요소 주위에 추가 공간이 생성됩니다.

새 코드 줄을 시작하세요. 요소를 중앙에 배치하는 것부터 시작하세요.

를 입력하세요.

이미지 코드를 추가하세요. php 중국 웹사이트

이미지의 높이와 너비를 지정할 수 있습니다. style="max-width:90%" width="200"> 또는 원하는 다른 크기를 입력하세요. 이것이 이미지를 표시하는 섹션의 끝입니다.

닫는 태그를 사용하세요. 예를 들어 전체 코드는 다음과 같습니다. 

<center><img src =“dancingdogpicture.gif”alt =“dance dog”align =“middle></center>
로그인 후 복사

위는 HTML 텍스트와 이미지를 중앙에 배치하는 방법입니다. 센터링 코드가 무엇인지에 대한 완전한 소개입니다. HTML5 온라인 매뉴얼에 대해 더 알고 싶다면 PHP 중국어 웹사이트를 주목하세요.


위 내용은 HTML 텍스트와 이미지를 중앙에 배치하는 방법은 무엇입니까? 센터링 코드란 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨：
图片 센터
원천：php.cn
이전 기사：피규어 태그란 무엇인가요? 언제 사용하나요? 다음 기사：div은 무슨 뜻인가요? HTML 및 CSS에서 div 태그를 사용하는 방법
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
Width 속성을 추가하여 콘텐츠를 왼쪽으로 이동합니다. 나는 본문에 여백을 제공했습니다. main {left margin: 200px; right margin: 200px; text alignment: center} ...
에서 2024-04-06 22:01:35
0
3
816
페이지가 갑자기 CSS나 부트스트랩을 가져올 수 없습니다. 그래서 저는 페이지를 개발 중입니다. 어제 일부 작업을 했는데 잘 작동했고, 오늘은 나머지 작업을 계속했는데 모든 것이 괜찮습니다. 일반 HTML 페이지로 열려고...
에서 2024-04-06 21:58:04
0
1
800
웹 애플리케이션에 버전 정보를 표시하는 모범 사례는 무엇입니까? 웹 애플리케이션을 개발 중입니다. 웹 애플리케이션에 버전 정보를 표시하는 모범 사례는 무엇입니까? 저는 semantic versioning을 사용하고 있고 이미 ...
에서 2024-04-06 19:13:16
0
2
476
문자열을 HTML 코드(배열에서 생성됨)로 바꾸는 최상위 방법 다음과 같은 문자열이 주어지면...$htmlPattern="Usernameis:#name#andusercompanyis#company#";하위 ...
에서 2024-04-06 17:40:41
0
2
410
Laravel 8 - /{editable_text} 경로를 /{user} 경로로 리디렉션하는 방법 사용자 프로필로 연결되는 리디렉션 경로를 만들려고 했습니다. 리디렉션 경로는 사용자 데이터베이스의 문자열/텍스트여야 하며 동일한 사용자 프로필 페이지로 리디렉션되...
에서 2024-04-06 17:26:11
0
1
410
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！