اچ تی ام ال (HTML)برنامه نویسیطراحی سایتفرانت اند (Front-end)

تگ p در HTML | بررسی تگ p و تگ br

تگ p در html
تگ p در html

معرفی تگ p

به جرات می توان گفت که بیشترین عاملی که سبب جذب مخاطب اینترنتی و افزایش بازدید سایت می شود، محتوای درون آن است. در این پست از بلاگ ویتکس به معرفی تگ p (تگ پاراگراف) به عنوان یک تگ بسیار کاربردی جهت قراردادن محتوا که همان متن ها و پاراگراف های گوناگون در سند HTML هستند، می پردازیم. پس تا انتهای این آموزش همراه ما باشید …

تگ p چیست؟

تگ p یک تگ Block-Level است که جهت قراردادن متن ها و پاراگراف های گوناگون از آن استفاده می شود. این تگ با تگِ بازِ <p> شروع و با تگِ بستهِ ی </p> پایان می یابد. بنابراین ساختار دستوری تگ پاراگراف به صورت زیر است:

<p> . . </p>

مثال: استفاده از تگ p در برنامه نویسی HTML

نمایش خروجی!

تنظیمات پیشفرض CSS

بیشتر مرورگرهای وب به صورت پیشفرض مقداری فضا از بالا (margin-top) و پایین (margin-bottom) به تگ p اضافه می کنند و آن را به صورت زیر نمایش می دهند:

این تنظیمات پیشفرض با اِعمال CSS از سوی برنامه نویس وب قابل تغییر هستند.

از این تگ برای قراردادن فاصله میان دو پاراگراف استفاده نکنید؛ چون در غیر این صورت این تگ هیچ محتوایی نخواهد داشت و ممکن است تکنولوژی های screen-reading هنگام درک محتوای صفحه دچار مشکلات خاصی شوند.

خط شکستگی (line break) در متن HTML

می توانید از تگ br برای ایجاد شکستگی یا فضای خالی میان جملات یک پاراگراف استفاده کنید. به نوعی می توان نقش تگ br را به نقش دکمه Enter (خط بعدی) در سند HTML تشبیه نمود.

مثال: استفاده از خط شکستگی (line break) در متن HTML

نمایش خروجی!

صفت align

از این صفت برای چیدمان یک متن (راستچین ، وسطچین و چپ چین) استفاده می شود.

استفاده از صفت align در HTML5 غیرمجاز بوده و پشتیبانی نمی شود.

مثال: صفت align در HTML 4.01

برای چیدمان یک متن در HTML5، از دستور text-align و یکی از سه مقدار رایج left، center، right در CSS استفاده نمایید :

مثال: چیدمان (align) صحیح یک متن در HTML5

نمایش خروجی!

مرورگرهای سازگار با تگ p

در جدول زیر، لیست مرورگرها و نسخه های سازگار آن ها با این تگ را مشاهده می کنید:

مرورگرهای دسکتاپ سازگار با تگ p
Google ChromeMozilla FirefoxInternet ExplorerMicrosoft EdgeOperaSafari Browser
گوگل کرومموزیلا فایرفاکساینترنت اکسپلوررمایکروسافت اجاپراسافاری
همه ی نسخه هانسخه ۱ و بالاترهمه ی نسخه هاهمه ی نسخه هاهمه ی نسخه هاهمه ی نسخه ها
مرورگرهای موبایل
Google ChromeMozilla FirefoxOperaSafari Browser
گوگل کرومموزیلا فایرفاکساپراسافاری
همه نسخه هانسخه ۴ و بالاترهمه نسخه هاهمه نسخه ها

امیدواریم از این مقاله نهایت بهره را برده باشید. برای بررسی سایر تگ های HTML می‌توانید به بلاگ ویتکس مراجعه کنید.

درباره نویسنده

محمد جاودانی

کارشناس مهندسی نرم افزار، برنامه نویس حوزه پایتون و جاوااسکریپت و علاقه مند به تولید محتوا

نوشته های مشابه

نظرات کاربران

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا