پیش قالب (pre)
تگ «پیش قالب (pre)» متن را همان طور که می نویسی نشان می دهد. یعنی فاصله ها و شکست خط ها حفظ می شوند. فونت هم ثابت عرض است؛ مثل دفتر شطرنجی که هر خانه یکسان است.
تعریف و کاربرد ساده
عنصر «pre» برای نمایش متن قالب دار است. مرورگر فاصله های پشت سرهم و خط های جدید را دقیقاً نگه می دارد. بنابراین، متن دقیقاً مثل کد منبع دیده می شود.
نمونه ساده pre
<pre>
Text in a pre element
is displayed in a fixed-width
font, and it preserves
both spaces and
line breaks
</pre>
pre با پهنای مشخص (CSS inline)
<div style="width:200px; overflow:auto;">
<pre>This is a pre with a fixed width. It will use as much space as specified.</pre>
</div>
نکات رفتاری پیش فرض
مرورگرها برای «pre» معمولاً display:block و font-family:monospace می گذارند. همچنین white-space:pre فعال است. پس متن دقیقاً با فاصله ها و خط ها نمایش می یابد.
ارتباط با تگ های مرتبط
برای قطعه کد از code، برای خروجی نمونه از samp، برای ورودی صفحه کلید از kbd و برای نام متغیر از var استفاده کن.
گام های سریعِ تمرین
- یک تگ <pre> بساز.
- متن را با فاصله ها و خط های دلخواه بنویس.
- در صورت نیاز، ظرف اسکرول دار تعریف کن.
جمع بندی سریع
- «pre» فاصله ها و خطوط را حفظ می کند.
- فونت آن معمولاً ثابت عرض است.
- برای کد و شعر مناسب است.
- می توان پهنا و اسکرول داد.