آموزش تگ pre در HTML آموزش طراحی وب

آموزش قبلی

آموزش صفات در HTML

آموزش بعدی

آموزش کامل ساختار یک فایل HTML

آموزش تگ pre در HTML

فهرست موضوعات در این آموزش

با عرض سلام خدمت کاربران سایت پاسخ وردپرس . در این آموزش مرحله به مرحله html قصد داریم به آموزش تگ pre در html .

تگ pre که از کلمه ( PreFormatted ) گرفته شده است، در لغت به معنی ( پیش فرمت ) می باشد، تگی است که با استفاده از آن میتوان یک متن سفارشی یا مثلا یک متن با فرمت دلخواه را درون یک صفحه وب ایجاد کرد.

همونطور که میدونید در زبان HTML در حالت عادی ما نمیتونیم متنی را بصورت دلخواه با فرمت دلخواه ایجاد نماییم، بفرض مثال ما نمیتونیم در یک پاراگراف هرچقدر که بخوایم بین کلمات فاصله بندازیم یا مثلا نمیتونیم اینتر بزنیم و سطر رو بشکنیم بریم سطر بعد و…

حال ما با استفاده از تگ pre به راحتی میتونیم هرمتنی را با هرنوع فرمتی که بخوایم در یک صفحه وب ایجاد نماییم. ( یعنی کلا هرچی داخلش بنویسید در خروجی هم دقیقا همونجوری نشونش میده )

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<p>Lorem ipsum dolor sit, amet consectetur      adipisicing elit.
     Tempora sint quod,                      laborum excepturi minima nisi tenetur nesciunt nam repellat enim commodi error 
    similique accusantium exercitationem necessitatibus molestiae dolorum quos odio.</p>
    <pre style="color: red;">
        Lorem ipsum dolor sit, amet consectetur      adipisicing elit.
     Tempora sint quod,                      laborum excepturi minima nisi tenetur nesciunt nam repellat enim commodi error 
    similique accusantium exercitationem necessitatibus molestiae dolorum quos odio.
    </pre>
    <pre>
        style="color: red;"
    </pre>
</body>
</html>