HTML - dir 属性_HTML 菜鸟教程

HTML dir 属性用于控制多语言网站中的文本方向，以确保内容的正确对齐。

网页设计师可以通过正确建立目录来设计更人性化和易于访问的网页，以适应各种书写系统和文化偏好。它可以应用于许多 HTML 元素，以指定文本是应从左到右（ltr）还是从右到左（rtl）显示。

语法

<element dir = "ltr | rtl | auto ">

此属性接受语法中提到的任何一个属性。

适用于

大多数 HTML 元素都支持 dir 属性。但是，dir 属性确实不受一些 HTML 元素的支持，尤其是那些不涉及文本内容或没有受文本方向性影响的视觉表示的元素。例如<html>， <head>， <title>， <meta>， <hr>

HTML dir 属性的示例

下面的示例将说明 HTML dir 属性，我们应该在哪里以及如何使用此属性！

使用 dir 属性的默认方向

在下面的示例中，我们将创建两个 p 元素，并在一个 p 元素上创建 sed，该元素将正常呈现。dir="ltr"

<!DOCTYPE html>
<html>

<head>
	 <title>HTML dir attribute</title>
</head>

<body>
	 <p>
			This is a sample Text direction is not set
	 </p>
	 <p dir="ltr">
			This is a sample Text direction is left to right  set
	 </p>
</body>

</html>

从右到左和从左到右方向内容

在以下示例中，让我们看看 dir 属性的用法，以及当我们使用具有不同值的 dir 属性时它将如何呈现内容

<!DOCTYPE html>
<html>

<head>
	 <title>HTML dir attribute</title>
</head>

<body>
	 <p dir="rtl">
			This paragraph is in English but 
			incorrectly goes right to left.
	 </p>
	 <p dir="ltr">
			This paragraph is in English and 
			correctly goes left to right.
	 </p>
	 <hr>
	 <p>
			هذه الفقرة باللغة العربية 
			ولكن بشكل خاطئ من اليسار إلى اليمين.
	 </p>
	 <p dir="auto">
			هذه الفقرة باللغة العربية ، لذا
			يجب الانتقال من اليمين إلى اليسار.
	 </p>
</body>

</html>

使用 dir 属性自动方向

考虑以下示例，我们要将 dir 设置为 auto。这将自动找到呈现文本的最佳方向。

<!DOCTYPE html>
<html>

<head>
	 <title>HTML dir attribute</title>
</head>

<body>
	 <p dir="auto">
			qikepu最适合免费教程
	 </p>
	 
	 <p dir="auto">
			لوريم إيبسوم هو ببساطة نص 
			وهمي من صناعة الطباعة
			والتنضيد. لقد كان لوريم إيبسوم
			هو النص الوهمي القياسي في هذه
			الصناعة منذ القرن السادس عشر
	 </p>
</body>

</html>

支持的浏览器

浏览器
是否支持	4.0	5.5	2.0	3.1	9.6

<< HTML - data-* 属性 HTML - draggable 属性 >>