HTML 텍스트 양쪽 맞춤

이 글에서는 HTML Justify Text에 대해 이야기하겠습니다. HTML에는 웹 페이지에서 프런트 엔드 작업을 보다 효과적으로 수행하기 위한 다양한 태그 세트가 있습니다. 본질적으로 HTML에는 단락 태그

웹 화면에 단락 문장을 작성하기 위해 HTML의 각 섹션에 사용자 요구 사항에 대한 정당화 태그가 필요한 경우 이를 사용자 정의하고

를 사용하면 문서를 활용할 것입니다. 단락 텍스트이거나 데이터 또는 텍스트 값이 정렬된 형식에 맞춰 정렬되어야 하는 것은 정렬 텍스트의 왼쪽이나 오른쪽에 따라 다를 수 있습니다. 각 텍스트 값은 웹 페이지에서 동일한 크기의 수평 공간을 차지합니다.

구문

HTML에는 보다 맞춤화 가능하고 사용자 친화적이며 브라우저와 사용자 보기에서 매력적인 웹페이지를 강조하기 위한 CSS 스타일이 있습니다. HTML 양쪽 맞춤 텍스트 값은 적절한 정렬로 텍스트 또는 값과 정렬됩니다. 기본적으로 양쪽 정렬 텍스트는 웹 페이지의 왼쪽에 있어야 합니다. 웹 페이지에서 HTML 정렬 정렬의 일반적인 구문을 살펴보겠습니다.

HTML 구문:

<p align="justify/left/right/center">
----some  codes----
</p>

CSS 구문:

div
{
text-align:justify/left/right/center;
text-justify:values;
}

위 코드는 문서의 텍스트 값을 정렬하기 위한 HTML 코드의 기본 구문입니다. text-justify 속성이 지정되고 속성 값은 텍스트 정렬이 justify에서 설정될 때 텍스트의 정렬 방법입니다.text-justify에는 auto, inter-word, inter-character와 같은 다른 속성 값 세트가 있습니다. 없음, 초기 및 상속; 자동을 사용하는 경우 각 값에는 서로 다른 설명 논리 세트가 있습니다. 브라우저 자체가 정렬 알고리즘을 결정하고, 단어 간 단어 사이의 간격을 늘리거나 줄입니다. 문자 간: 문자 사이의 간격을 늘리거나 줄입니다. , 없음을 사용하면 정렬 방법이 자동으로 비활성화되고 속성 태그의 기본값을 초기 설정하고 값을 상속하여 속성의 하위 요소에 상위 요소를 상속합니다.

HTML에서 양쪽 정렬 텍스트를 만드는 방법은 무엇입니까?

일반적으로 정당화 텍스트는 사용자 관점에서 보면 다른 의미를 갖습니다. 이는 HTML 텍스트가 양쪽에서 모두 정렬되어야 한다고 간주합니다. 텍스트 줄은 왼쪽과 오른쪽 모두에 맞춰져 있어 이중 확인을 설명할 수 있습니다. 일반적으로 정렬 단어를 사용하는 경우를 제외하고는 텍스트의 모든 줄을 정렬할 수 있습니다. 최종 단어의 너비와 높이가 동일하므로 이를 달성하는 데 사용되는 방법은 일반적으로 필요에 따라 단어 사이에 추가 공백을 두는 것입니다.

이러한 정렬 방법은 HTML 문서에 널리 퍼져 있으며, 인쇄를 통해 고품질 웹 페이지를 얻는 데 사용하는 필수 속성은 하드카피 형식의 콘텐츠가 필요할 때에도 좋습니다. HTML4부터는 텍스트 속성을 정렬하는 데 사용할 수 있습니다. 구문과 의미가 다르지만 대규모 요소 세트의 경우. HTML에서 양쪽 맞춤을 사용하면 문서에 일부 HTML 요소/태그가 허용됩니다.

,

,

…

,,, ,, ,, ; 이는 텍스트를 정렬하고 단락을 정렬하는 몇 가지 요소입니다.

즉, 텍스트 값을 양쪽 정렬 방식으로 정렬하는 코드입니다. 엄격한 버전의 html

,

를 사용하여 요소 및 태그 속성이 더 이상 사용되지 않는 경우가 있습니다. 태그는 웹페이지의 HTML 문서에서 사용하는 첫 번째 그룹 세트이자 제목 요소입니다.

HTML 대신 XHTML을 사용한다면 XHTML은 전환기 dtd일 뿐입니다.

,

,

…

와 같은 태그의 값으로 "정렬"을 허용하지 않습니다. 엄격한 dtd는 모든 상황에서 HTML 정렬을 허용하지 않습니다. 엄격한 dtd 문서에서 justify 태그를 사용하면 감독으로 인한 오류가 표시됩니다. 이는 유효성 검사기가 align=” justify” 코드가 오류인 것처럼 값을 정렬한다는 의미입니다. 양쪽 여백을 맞춰준다는 뜻은 양쪽 여백을 맞춰준다는 뜻입니다.

HTML 코드에서 align=" justify"를 사용하면 모든 브라우저에서 널리 지원되지만 Opera, IE4 및 일부 다른 브라우저와 같은 일부 버전에서는 Netscape에서 "unjustified" 오류(왼쪽 정렬)와 같은 오류가 표시됩니다. . 정렬과 관련된 스타일시트 규칙을 적용하지 않은 단락 태그

We will use some CSS options properties like float,inline-block, font styles, positions of the images, breadth, width, and height of the images; similarly, navigation options will do some alignments for the menus in the document; the above all options will use the HTML with CSS options same like justifying options in the document. Suppose we use IE Explorer for running an HTML web page. In that case, it has some nonstandard CSS properties that may affect some methods of justification, like example, “just-textify,” if we use IE version earlier, like 5.5 or later, it also recognizes the properties like text-align-last, it will show the horizontal alignment of the web page.

Examples of HTML Justify Text

We will see some examples of understanding the basics in the HTML justify part.

Example #1

Code:

<p align="justify">Welcome To My Domain.</p>
<p><b>Welcome</b>Users</p>

Output:

Example #2

Code:

<style>
div {
color: green;
border: 3px blue;
}
h1  {
color: initial;
}
</style>


<div>
<p align="justify">Welcome To My Domain.</p>
<p><b>Welcome</b>Users</p>
</div>

Output:

Example #3

Code:

<style>
div {
color: green;
border: 3px blue;
}
h1  {
color: initial;
}
</style>


<div>
<img src="/static/imghw/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/172543951033739.png" class="lazy" align="right" alt="HTML 텍스트 양쪽 맞춤"   style="max-width:90%">
<p>Welcome To My Domain.</p>
<p><b>Welcome</b>Users</p>
</div>

Output:

The above three examples will show the justify options in HTML in different ways. The first example will point out the basic notification for using justify option in the document; the second example will use the CSS style for the document will be more attractive from the user’s perspective. The final example will use the jpg image on the right side of the web page; if we declare justify, it will show the image in the default view.

Conclusion

Applying the options in a document, like a web page, will show good quality based on the user requirement, including justification, page breaks, etc. Justification might take some small pieces of text or values presented creatively or primarily for the web page. We should check several validations and conditions to apply and display browser compatibility mode.