خط قرمز html را می توان به 4 روش مختلف تنظیم کرد. اگرچه این زبان برنامه نویسی استانداردهای خاصی را برای این پدیده ارائه نمی دهد، بنابراین محدودیتی در این زمینه وجود ندارد. در این مقاله از مجموعه ابزارهای غیر استاندارد برای ایجاد خط قرمز استفاده خواهیم کرد.

روش 1

ارزش شروع با رایج ترین روش را دارد. فقط در این مورد استفاده از جداول آبشاری ضروری است، زیرا CSS به طور جدایی ناپذیری با زبان نشانه گذاری فرامتن مرتبط است. خط قرمز html را می توان با استفاده از ویژگی "text-indent" تنظیم کرد. کافی است عنصر مورد نظر و فاصله ای که برای تورفتگی استفاده می شود در سمت چپ سند مشخص شود. به عنوان مثال، نوشتن: "p (text-indent: 20px;)" به این معنی است که یک خط قرمز 20 پیکسلی در هر پاراگراف p ساخته می شود. شما می توانید از هر بلوک متنی به عنوان عنصری که مقدار را برای آن تعیین می کنید استفاده کنید. در واقع این ویژگی خط قرمز را تعیین نمی کند، بلکه فقط تورفتگی خط اول عنصر انتخاب شده را نشان می دهد. اما چه کسی متوجه تفاوت خواهد شد؟ ویژگی "text-indent" می تواند سه نوع مقدار متفاوت داشته باشد:

• هر واحد اندازه گیری پذیرفته شده عمومی، به عنوان مثال px (پیکسل)، در (اینچ)، pt (نقاط) و موارد دیگر.
• ارزش درصد. در این حالت فاصله از عنصر والد در نظر گرفته می شود.
• به ارث می برند. وقتی این مقدار مشخص شد، ویژگی از عنصر والد به ارث می رسد.

روش دوم

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

روش سوم

نتیجه

به عنوان یک نتیجه، می توان گفت که html همراه با CSS به شما امکان ایجاد افکت های بسیار متنوعی را می دهد. گاهی اوقات از ویژگی ها و عناصر برای هدف مورد نظر خود استفاده نمی شود، اما نباید خیلی از معنای استاندارد برچسب ها منحرف شوید.

به عنوان یک قاعده، بلوک های متن با پاراگراف ها (پاراگراف ها) از هم جدا می شوند. به طور پیش فرض، یک فضای عمودی کوچک بین پاراگراف ها وجود دارد که به آن فاصله می گویند. نحو ایجاد پاراگراف ها به شرح زیر است.

بند 1

بند 2

هر پاراگراف با یک برچسب شروع می شود

و با یک تگ بسته اختیاری به پایان می رسد

.

در هر کتابی، از تورفتگی خط اول، که "خط قرمز" نیز نامیده می شود، برای برجسته کردن پاراگراف بعدی استفاده می شود. این به خواننده اجازه می دهد تا به راحتی به دنبال یک خط جدید بگردد و در نتیجه خوانایی متن را افزایش می دهد. در یک صفحه وب، معمولاً از این تکنیک استفاده نمی شود، اما از padding برای جداسازی پاراگراف ها استفاده می شود.

مثال 7.1 استفاده از پاراگراف ها برای ایجاد تورفتگی بین خطوط را نشان می دهد.

مثال 7.1. استفاده از پاراگراف ها

در برخی جاها هنوز فوریه است، در برخی دیگر در حال حاضر آوریل است.

زمان می گذرد، شمارش ابدی: سال به سال، قرن به قرن...

در همه چیز - سرعت بدون عجله او، دویدن تاریک او.

در یک سال بیست و پنج هفته شادی و غم وجود دارد.

من بیست و پنج هفته به فوریه، و بیست و پنج هفته به آوریل هستم.

برای بیست و پنج هفته، قرن ها در مه می گذرد.

مسخره ی پرصدای من جایی به سمت ابرها پرواز می کند.

M. Shcherbakov

نتیجه این مثال در شکل نشان داده شده است. 7.1.

برنج. 7.1. تورفتگی در صفحه وب هنگام استفاده از پاراگراف ها

همانطور که از شکل مشخص است، هنگام استفاده از تگ

فاصله بین پاراگراف ها بسیار زیاد است. در صورت اضافه کردن یک برچسب در خطوط شکست، می توانید از شر آنها خلاص شوید:
. برخلاف پاراگراف، تگ شکست خط
فضاهای عمودی اضافی بین خطوط ایجاد نمی کند و تقریباً در هر متنی قابل استفاده است.

بنابراین، متن مثال 7.1، با در نظر گرفتن شکست خط، به صورت زیر تبدیل می شود (مثال 7.2).

مثال 7.2. برچسب بزنید

درختان بادام در برخی باغ ها شکوفه می دهند، در حالی که در برخی باغ ها طوفان برف می وزد.
در برخی جاها هنوز فوریه است، در برخی دیگر در حال حاضر آوریل است.
زمان می گذرد، شمارش ابدی: سال به سال، قرن به قرن...
در همه چیز - سرعت بدون عجله او، دویدن تاریک او.
در یک سال بیست و پنج هفته شادی و غم وجود دارد.
من بیست و پنج هفته به فوریه، و بیست و پنج هفته به آوریل هستم.
برای بیست و پنج هفته، قرن ها در مه می گذرد.
مسخره ی پرصدای من جایی به سمت ابرها پرواز می کند.

M. Shcherbakov

نتیجه مثال در شکل نشان داده شده است. 7.2. مشاهده می شود که فاصله بین خطوط متن کاهش یافته و ظاهر فشرده تری پیدا کرده است.

برچسب هایی که پاراگراف، فضا، بلوک HTML و پاراگراف را تعریف می کنند

بیایید با جزئیات به آن نگاه کنیم بلوک ها و پاراگراف های HTMLبه عنوان عناصر یک صفحه وب

• پاراگراف HTMLتوسط برچسب ها تعریف شده است.
• پاراگراف های HTMLمعمولاً حاوی متن، برچسب های قالب بندی و تصاویر است.
• پاراگراف HTMLنمی تواند شامل عناصر بلوک مانند هدر باشد
  

  -

  ، مسدود کردن
  و پاراگراف های دیگر
• بلوک HTMLتوسط برچسب ها تعریف شده است
  .
• بلوک HTMLمی تواند هر عنصری از یک صفحه وب را در هر مقداری داشته باشد.
• بلوک های HTMLعالی برای صفحات وب و آسان برای دستکاری.

کد زیر را در نظر بگیرید:

نتیجه:

ما می توانیم آن را ببینیم پاراگراف های HTMLدارای تورفتگی عمودی - این یکی از ویژگی های برچسب ها است. بلوک های HTML

چنین فضاهایی به این دلیل ایجاد نمی شوند که باری را حمل نمی کنند، بلکه صرفاً ظرف هستند.

برچسب ها نمی توانند حاوی موارد دیگر یا باشند

. عناصر خطی را می توان در داخل قرار داد، مانند یا، برای مثال، برچسب هایی که مسئول قالب بندی متن هستند.

تگ ها و در اصل یکسان هستند، اما کنسرسیوم W3C استفاده از حروف کوچک را توصیه می کند. در نسخه جدید HTML، مانند XHTML مدرن، استفاده از حروف بزرگ هنگام نوشتن برچسب ممنوع است.

مسدود کردن

می تواند هر تعداد که دوست دارید شامل شود و عناصر دیگر HTMLسند برای طرح‌بندی ایده‌آل است، اما در ادامه در مورد آن بیشتر - در درس‌های آموزشی CSS.

فضای HTML از جدول کاراکترهای خاص

فضای HTMLبه شما امکان می دهد فاصله بین کلمات و کاراکترها را افزایش دهید.

در مورد فاصله بین کلمات، مهم نیست که چه تعداد در Notepad، یعنی در کد منبع وجود داشته باشد، تنها یکی در صفحه وب نمایش داده می شود. اگر نیاز به افزایش فاصله دارید، از کاراکتر فاصله از جدول نمادها استفاده کنید. ممکن است بپرسید: چرا به این معانی رمزگذاری شده شخصیت های معمولی نیاز است؟ - پاسخ می دهم: برای نمایش مثلاً چنین براکت هایی لازم است< >. به عبارت دیگر، برای نمایش برچسب ها روی صفحه، در ویرایشگر خود می نویسم: . برچسب ها همانطور که به یاد داریم، متن را به monospace (تایپینگ) تبدیل کنید.

راه های نمایش پاراگراف HTML

نمونه هایی از خروجی پاراگراف

برای دادن یک سبک خاص، باید متن را در ظرف مناسب قرار دهید.

تمام تگ های قالب بندی را می توان به سه گروه تقسیم کرد:

1. برچسب های عنوان ( h1-h6).

2. تگ های طراحی متن بدنه ( , , ,

, 
و غیره.).
3. گروه بندی برچسب ها ( 

, 

, 

)

برچسب های عنوان
آنها متن معمولی را به عنوان یک سطح مشخص تبدیل می کنند.  برچسب بزنید 

یک عنوان سطح اول ایجاد می کند - بزرگترین و مهم ترین (معمولا عنوان مقاله در صفحه)، 

مسئول عنوان سطح ششم است - کوچکترین و نامحسوس ترین.  این برچسب ها هم برای کاربران و هم برای موتورهای جستجو مهم هستند - هر دوی آنها عناوین با عنوان فرعی را دوست دارند.  سلسله مراتب سطوح باید رعایت شود، یعنی 

باید بروند 

، و نه برعکس.

برای اینکه بفهمید چگونه این کار می کند، کد زیر را در فایل html وارد کنید:
 
هدر سطح اول
عنوان سطح دوم
عنوان سطح سوم
عنوان سطح چهارم
عنوان سطح 5
سرفصل سطح شش

در مرورگر به این صورت خواهد بود:
برچسب های طراحی متن بدنه
امکان قالب بندی در سطح کاراکتر را فراهم می کند.  بیایید ببینیم چه کاری می توانید با آنها انجام دهید.
فونت پررنگ
باید توجه را روی متن متمرکز کرد.  همچنین برای موتورهای جستجو مهم است، آنها می توانند کلمات کلیدی را برجسته کنند.
مسئول تگ های سبک پررنگ 
و .

زیرنویس و زیرنویس
آنها را می توان در فرمول ها، معادلات و تعیین کمیت های خاص استفاده کرد.
تگ مسئول ایجاد اشتراک است 
، برای بالاترین ها از برچسب استفاده می شود 
.
ایکس 1= 32 متر 2
کوچک کردن
اگر نیاز دارید که متن را یک عدد کمتر از مقدار تنظیم شده در سراسر صفحه کنید، باید از تگ استفاده کنید 

متن ساده متن کاهش یافته است.
تاکید کنید
این نوع برجسته سازی می تواند برای نشان دادن تغییرات ایجاد شده در یک سند یا صرفاً برای جلب توجه به متن استفاده شود.
متن ساده متن خط دار
ضربه زدن
اگر اطلاعات مربوط به خود را از دست داده اند، می توانید خط بزنید.  این برچسب برای این است 
.
حروف کج
برای تمرکز توجه روی متن مورد نیاز است و می توان آن را با یک برچسب ایجاد کرد 
یا 
.

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

  بدین ترتیب الف، ب، ج، اینجا نتیجه اجرای برنامه ، و این است کاربر متنی را وارد کرد 
چیزی شبیه به این نمایش داده شد
.

نقل قول ها و تعاریف
کد برنامه شبیه به این خواهد بود 
بدین ترتیب 
، متغیرها به صورت زیر تعیین می شوند: 
الف، ب، ج 
، اینجا 
نتیجه اجرای برنامه 
، و این است 
کاربر متنی را وارد کرد 
.  قالب بندی اصلی را حفظ کنید 
چیزی شبیه به این نمایش داده شد 

.

 
نقل قول در تگ blockquote.
نقل قول در داخل محفظه نقل قول.نقل قول کوتاه با برچسب q.تعریف اختصاصی.مخفف (NPO، IP).

مثال کلی
برای درک بهتر اینکه هر تگ مسئولیت چیست و چگونه کار می کند، به کد زیر و نتیجه اجرای آن نگاه کنید.
 
چربمتن را می توان به برچسب تبدیل کرد قویو ب.  پشت موربپاسخ ماو من.
برچسب ها زیرو شامبرای ایجاد استفاده می شود پایین تر(ایکس 1…ایکس n) و بالا (42=16) نمایه ها. دل خط می کشد, ins - تاکید می کند.
برچسب ها کد, kbd, varو سمپبه ندرت استفاده می شوند و برای نمایش لیست برنامه ها مورد نیاز هستند
 abbrبرای نشان دادن اختصارات ( HTML).  از تگ های blockquote، cite و q برای قالب بندی نقل قول ها استفاده می شود ( آسمان در پاییز نفس می کشید)
پیش تگ قالب بندی متن اصلی را بدون حذف فاصله یا شکست خط حفظ می کند.

مرورگر این کد را به صورت زیر تفسیر می کند:

گروه بندی برچسب ها
لازم است متن در یک خط پیوسته جریان نداشته باشد، بلکه به اجزای منطقی تقسیم شود.
داخل تگ ها یک پاراگراف است.
 
پراگراف اول
پاراگراف دوم


برچسب بزنید 

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

به شما اجازه می دهد یک خط افقی بکشید.  می توانید از آن برای جداسازی متن با وضوح بیشتری استفاده کنید.  ویژگی های عرض, اندازه, رنگ, تراز کردنو بدون سایهبه ترتیب عرض، ضخامت، رنگ، تراز و عدم اثر سه بعدی خط را تنظیم کنید.
 
خط بالای خط 
خط زیر خط









 Lorem IPSUM Dolor Sit Amet، Consectur Adipisicing Elit، Sed Do Eiusmod Tempor Incididunt Ut Labore et Dolore Magna Aliqua. به روز رسانی "Velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."  پاراگراف 1.10.32 "de Finibus Bonorum et Malorum" نوشته سیسرو در سال 45 بعد از میلاد.  "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore vertatis et quasi architecto beatae vitae vitae dicta sunt aplicabo. Nemo en. این یک فرار است، sed چه نتیجه‌ای بزرگ به‌دست می‌آید، چه نتیجه‌ای که می‌خواهد به دنبال آن باشد.  ترجمه انگلیسی 1914، H. Rackham "اما من باید برای شما توضیح دهم که چگونه این ایده اشتباه تقبیح لذت و ستایش درد به وجود آمد و من گزارش کاملی از سیستم به شما ارائه خواهم داد و آموزه های واقعی کاشف بزرگ را توضیح خواهم داد. حقیقت، استاد سازنده سعادت انسان است. هیچ کس خود لذت را رد نمی کند، دوست ندارد، یا از آن دوری نمی کند، زیرا لذت است، بلکه به این دلیل است که کسانی که نمی دانند چگونه به طور عقلانی لذت را دنبال کنند، با عواقبی بسیار دردناک مواجه می شوند. هر کسی که دوست دارد یا دنبال می‌کند یا می‌خواهد دردی را از خود به دست آورد، زیرا درد است، اما گاهی اوقات شرایطی پیش می‌آید که در آن روغن و درد می‌تواند لذتی بزرگ برای او به ارمغان بیاورد. اما چه کسی حق دارد از کسی که لذت بردن از لذتی را انتخاب می‌کند که عواقب آزاردهنده‌ای ندارد، یا کسی که از دردی که هیچ لذتی به بار نمی‌آورد اجتناب می‌کند عیب کند؟»  پاراگراف 1.10.33 "de Finibus Bonorum et Malorum" نوشته سیسرو در سال 45 پس از میلاد. "At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias استثنائا سینت occaecati cupiditate غیر مشروط، تشبیه شده در culpa de labour qui offi. et harum qui نام آزاد زمانی، با حلول نوبیس است که برگزیده می شود و نمی تواند مانع از آن شود. necessitatibus saepe eveniet "ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat."  ترجمه انگلیسی 1914، H. Rackham "از سوی دیگر، ما با خشم و بیزاری عادلانه مردانی را محکوم می کنیم که از جذابیت های لذت لحظه ای چنان فریب خورده و افسرده شده اند، آنچنان از هوس کور شده اند که نمی توانند درد و مشکلی را که در آن وجود دارد پیش بینی کنند. ناگزیر است و سرزنش مساوی کسانی است که به دلیل ضعف اراده در انجام وظایف خود کوتاهی می کنند، که همان گفتن از طریق کوتاهی از زحمت و درد است. این موارد کاملاً ساده است و به راحتی قابل تشخیص است. قدرت انتخاب ما بلامانع است و زمانی که هیچ چیز مانع از توانایی ما در انجام کاری که دوست داریم نمی شود، باید از هر لذتی استقبال کرد و از هر درد و رنجی اجتناب کرد. بنابراین، انسان عاقل همیشه در این موارد به این اصل انتخاب پایبند است: برای تأمین لذت‌های بزرگ‌تر، لذت‌ها را رد می‌کند، وگرنه برای اجتناب از دردهای بدتر، دردها را تحمل می‌کند.»