HTML خط خورده است. Strikethrough متن HTML
شرح
تزئین متن را به صورت خط کشی، خط زدن، یک خط بالای متن و چشمک زدن اضافه می کند. با فهرست کردن مقادیر جدا شده با فاصله، می توانید بیش از یک سبک را در یک زمان اعمال کنید.
نحو
متن-تزیین: [چشمک زدن || خط از طریق || روی خط || زیر خط ] | هیچکدام | به ارث می برند
ارزش های
blink متن را برای چشمک زدن تنظیم می کند. چنین متنی به طور دوره ای، تقریباً یک بار در ثانیه ناپدید می شود، سپس دوباره در جای اصلی خود ظاهر می شود. این مقدار در حال حاضر توسط مرورگرها پشتیبانی نمی شود و در CSS3 منسوخ شده است و به جای آن انیمیشن پیشنهاد می شود. line-through متن خطی را ایجاد می کند (مثال). overline یک خط از روی متن می گذرد (مثال). underline متن را تنظیم می کند که زیر آن خط کشیده شود (مثال). none همه جلوه ها را لغو می کند، از جمله زیر لینک ها، که به طور پیش فرض تنظیم شده است. inherit مقدار از والد به ارث می رسد.HTML5 CSS2.1 IE Cr Op Sa Fx
حمله استراتژیک
مدل شی
document.getElementById("elementID").style.textDecoration
document.getElementById("elementID").style.textDecorationBlink
document.getElementById("elementID").style.textDecorationLineThrough
document.getElementById("elementID").style.textDecorationNone
document.getElementById("elementID").style.textDecorationOverLine
document.getElementById("elementID").style.textDecorationUnderline
مرورگرها
نسخه های اینترنت اکسپلورر تا 7.0 از مقدار ارثی پشتیبانی نمی کنند. خط به دست آمده با استفاده از مقدار خط عبور در IE7 نسبت به سایر مرورگرها بالاتر است. این باگ در IE8 رفع شده است.
سلام به همه! در مقالات قبلی چیزهای زیادی در مورد پیوندها و تصاویر یاد گرفتیم. حالا وقت آن است که به سراغ متن برویم. در این مقاله در مورد محبوب ترین تگ های html که برای دادن ظاهر خاصی به متن استفاده می شوند صحبت خواهم کرد.
بنابراین، ابتدا یک سند متنی خالی در Notepad ایجاد کنید. پس از آن پسوند آن را از txt به html تغییر دهید. ما آن را به طور همزمان با استفاده از یک مرورگر و یک ویرایشگر متن، به عنوان مثال، همان دفترچه یادداشت باز می کنیم. من توصیه می کنم از این برنامه برای این اهداف استفاده کنید Macromedia Dreamweaverیا Notepad++.
با استفاده از ویرایشگر، سند خود را ویرایش می کنیم و کارهایی را که با استفاده از مرورگر انجام داده ایم مشاهده می کنیم.
برای اعمال تغییرات، ابتدا باید با فشردن فلاپی دیسک یا کلید ترکیبی Ctr+S تغییرات را در ویرایشگر ذخیره کنید و سپس همان سند را در مرورگر Refresh کنید.
عنوان متن در سطوح مختلف
سرفصل ها نه تنها بخش مهمی از طراحی متن هستند، بلکه یکی از ابزارهای بهینه سازی داخلی نیز هستند. در متن html سرفصل ها توسط تگ ها تنظیم می شوند
متن مورد نظر خود را به عنوان عنوان در اینجا قرار دهید
عدد 2 در کنار حرف h سطح عنوان را نشان می دهد. در مجموع 6 سطح وجود دارد که سطح اول عنوان مقاله است. بقیه عناوین بخش و فرعی هستند.
متن پررنگ، خط دار، مورب
برچسب ها , , به راحتی این مشکل را حل کنید
به این ترتیب می توانید متن پررنگ را در html تنظیم کنید
به این ترتیب حروف کج تنظیم می شود
این متن زیرخط دار خواهد بود
اگر لازم باشد چندین ویژگی را به طور همزمان به متن اعمال کنیم، به سادگی تگ ها را یکی داخل دیگری قرار می دهیم.
کج با حروف درشت
تغییر اندازه فونت
اندازه فونت متن در html با استفاده از تگ تنظیم می شود ، که دارای ویژگی "اندازه" است.
اندازه فونت 5
نحوه تغییر رنگ متن
رنگ متن توسط همان تگ با استفاده از ویژگی "color" تنظیم می شود
متن قرمز
متن همانطور که تایپ شد
HTML یک ویژگی نسبتاً ناخوشایند دارد. اگر متنی را که دارای چندین فاصله در یک ردیف است، یکی پس از دیگری تایپ کرده باشید، مرورگر فقط یک فاصله را نشان می دهد. در برخی موارد لازم است متن دقیقاً همانطور که تایپ شده نمایش داده شود. برای این کار از تگ استفاده می شود
این متن همانطور که تایپ می شود به نظر می رسد
خب، احتمالاً همین است. طبیعتاً امکان تغییر متن با استفاده از تگ های html بسیار محدود است. در بیشتر موارد این کافی نیست. در این مورد توصیه می شود از css استفاده کنید. CSSاین یک مخفف است که به روسی ترجمه شده است به معنای شیت های سبک آبشاری است. در یکی از درس های بعدی بیشتر در این مورد صحبت خواهیم کرد.
متن خط خورده
به طور کلی، در HTML می توانید متن خطی را با استفاده از سه تگ مختلف به طور همزمان تنظیم کنید. برچسب ها و در همه مرورگرها کاملاً درست نمایش داده می شوند، با این حال، استفاده از آنها توصیه نمی شود. آنها حتی در مشخصات XHTML و HTML5 گنجانده نشده اند. بنابراین برای ایجاد متن خط خطی استفاده از تگ را توصیه می کنم .
متن خط خورده
از نظر ظاهری، نتیجه استفاده از این تگ هیچ تفاوتی با دو مورد اول نخواهد داشت. با این حال، معنای کمی متفاوت دارد. این تگ قرار است برای خط زدن اطلاعات قدیمی یا نادرست استفاده شود. این تگ دارای 2 ویژگی است:
نقل قول - در نظر گرفته شده حاوی پیوندی به سندی باشد که حاوی دلیل حذف این اطلاعات است
datetime - برای ذخیره زمان آخرین ویرایش اطلاعات در نظر گرفته شده است.
برای خط خطی متن در HTML، از تگ استفاده کنید ضربه:
- الکترونیک
- سیروژکین
اسمیرنوفچیژیکوف- کوکوشکینا
نتیجه اجرای این کد:
- الکترونیک
- سیروژکین
- اسمیرنوف
- چیژیکوف
- کوکوشکینا
این تگ هیچ ویژگی ندارد. به جای تگ HTML ضربهاز یک نسخه کوتاه شده نیز می توان استفاده کرد - س(به طور مشابه، پررنگ - ب، مورب - من، خط کشی کرد - تو):
سازنده لگو"نوبکس"
همانطور که می بینید نتیجه مشابه است:
مجموعه ساخت لگو "Nubex"
استفاده از تگ سو ضربهاز نقطه نظر اعتبار سنجی کد نادرست در نظر گرفته می شود (لازم است از یک گذرا استفاده شود). یا گزینه دیگر استفاده از CSS است.
متن خط خورده: CSS
با CSS، متن را می توان با استفاده از ویژگی "decare" کرد متن-تزیین. این ویژگی می تواند مقادیر زیر را داشته باشد:
- از طریق خط- برای خط زدن متن استفاده می شود.
- زیر خط بکش- زیر متن خط می کشد؛
- خط کشی- برای قرار دادن یک خط بالای متن (متن روی خط) استفاده می شود.
- چشمک زدن- فلش های آزمایشی (هر ثانیه)؛
- هیچ یک- به شما امکان می دهد تمام جلوه های اعمال شده روی متن را لغو کنید.
مقادیر مشخص شده را می توان به طور همزمان اعمال کرد؛ برای انجام این کار، باید پارامترهای لازم را که با یک فاصله از هم جدا شده اند، بنویسید. به عنوان مثال، زیر خط، خط کشیدن و چشمک زدن را همزمان اعمال کنید:
تزیین متن: زیر خط چشمک زدن روی خط.
حالا بیایید با استفاده از CSS، متن خط خطی را بسازیم:
سازنده لگوسایت های نوبکس
CSS به شما اجازه می دهد تا عملیات های متنوعی را در رابطه با دکوراسیون تزئینی کل صفحه انجام دهید. توجه ویژه ای به متن می شود که در اکثر موارد اکثر سایت ها را پر می کند. امروز ما به یک ویژگی جالب توجه خواهیم کرد: متن خط دار، زیر خط دار و خط خطی شده. همه این افکت ها با استفاده از یک قانون CSS تنظیم می شوند.
وظیفه
می توانید با استفاده از دستور text-decoration زیر متن در CSS خط کشیده و خط خطی کنید. تأثیر به مقدار مشخص شده بستگی دارد. CSS برای جداسازی بخش های منطقی و ساختاری یک صفحه وب اختراع شد. اما قبل از ظهور Cascading Style Sheets از تگ های HTML استفاده می شد که معنای مشابهی داشتند. به عنوان مثال، عنصری مانند به شما امکان نمایش متن خط خورده را می دهد. این تگ اکنون نامطلوب تلقی می شود و استفاده از آن به طور خودکار کد صفحه شما را باطل می کند. اگرچه این عنصر هنوز توسط تمام مرورگرهای مدرن پشتیبانی می شود و توسط برخی از توسعه دهندگان استفاده می شود. اما بیایید به CSS برگردیم. دستور "text-decoration" می تواند معانی زیر را داشته باشد:
- زیر خط بکشید. با اختصاص این مقدار، به دست می آورید
- روی خط. خط از قسمت خاصی از صفحه عبور می کند.
- خط از طریق. متن خطی یا خطی ایجاد می کند.
- پلک زدن. قطعه سند انتخاب شده به صورت دوره ای ناپدید می شود و دوباره ظاهر می شود.
- مقادیر "هیچ" و "ارث" نیز وجود دارد. اولی تمام اثرات را لغو می کند و دومی دستور می دهد که ویژگی از عنصر والد به ارث برده شود.
هدف
به نظر می رسد که در CSS متن خطی و افکت های مشابه فقط برای تزئین متن استفاده می شود. در بیشتر موارد این گفته درست است. اما گاهی اوقات ارزش این را دارد که به این سوال فکر کنیم: چرا چنین عناصری ایجاد شده اند؟ به عنوان مثال، برچسب "اعتصاب" منسوخ شده برای نشان دادن اطلاعات نادرست یا قدیمی استفاده می شود. خوانندگان با دیدن متن خط خورده، معنای پنهان چنین نامگذاری را درک می کنند. کلماتی که زیر آنها خط کشیده شده است همیشه بلافاصله از جریان عمومی خارج می شوند. بنابراین، این اثر باید برای برجسته کردن اطلاعات مهم استفاده شود. مقدار "چشمک زدن" که باعث چشمک زدن متن می شود، به ندرت استفاده می شود، زیرا چنین اثری معمولاً در بین برنامه نویسان غیرقابل قبول در نظر گرفته می شود. از این گذشته، تعداد کمی از خوانندگان شما نمادهای چشمک زن را دوست دارند که دائماً حواس آنها را پرت می کند. خوب، مقدار "Overline" فقط برای تزئین متن استفاده می شود.
ویژگی های خاص
اگرچه تمام مقادیر ویژگی "تکست-دکوراسیون" در مشخصات نسخه Cascading Tables گنجانده شده است، اما هنوز مقادیری وجود دارند که توسط مرورگرهای مدرن پشتیبانی نمی شوند. به عنوان مثال، متن چشمک زن در IE قابل مشاهده نخواهد بود. مرورگر گوگل کروم برخی از مقادیر را نمی پذیرد. پلتفرم های موبایل به طور کامل از این ویژگی پشتیبانی نمی کنند.
نتیجه
افکت هایی مانند متن خط خطی و سایر مقادیر مشابه اغلب در اینترنت استفاده می شوند. استفاده از آنها به شما امکان می دهد ایده اصلی نویسنده را به درستی بیان کنید و به تمرکز توجه خوانندگان بر روی قسمت مورد نظر متن کمک می کند. اما زیاد غیرت نداشته باشید و در صورت امکان از ویژگی "تزیین متن" استفاده کنید. از این گذشته، تزئین بیش از حد متن می تواند به شما و خوانندگان شما آسیب برساند.
این تگ هنوز به طور گسترده ای برای خط کشی متن در کد HTML استفاده می شود.
، که املای کوتاه تگ است
. از میان معانی متعدد کلمه انگلیسی «اعتصاب»، «خط زدن» و «خط زدن» است. نتایج استفاده از این دو تگ به این صورت است:
متن با استفاده از برچسب زده شده است→ خط خطی متن با استفاده از برچسب
همانطور که می بینید، نتیجه یکسان است. همه مرورگرهای مدرن این برچسب ها را درک می کنند، اما با این وجود، هر دوی آنها برای استفاده توصیه نمی شوند. آنها به طور کامل از مشخصات XHTML و HTML5 غایب هستند. و مشخصات HTML 4.0 نیز نامطلوب توصیف شده است.
دلیل این امر این است که برچسب ها و متعلق به دسته ای از برچسب های به اصطلاح قالب بندی فیزیکی هستند. یعنی هیچ گونه بار معنایی را تحمل نمی کنند و فقط سبک نمایش متن را تعیین می کنند. با این حال، خود زبان نشانه گذاری HTML به طور خاص برای نشانه گذاری معنایی متن در نظر گرفته شده است. و برای قالب بندی بصری از شیوه نامه های CSS استفاده می شود.
و اگرچه ممکن است به چنین جزئیات آکادمیک اهمیت ندهید، هنوز از این برچسب های قدیمی استفاده نکنید. اگر نیاز به خط خطی متن در HTML دارید، بهتر است از تگ استفاده کنید
. در اینجا نتیجه استفاده از آن است:
متن با استفاده از برچسب زده شده است→ خط خطی متن با استفاده از برچسب
همانطور که می بینید، از نظر بصری هیچ تفاوتی بین آنها وجود ندارد ,
و ، اما در معنی تفاوت بسیار زیادی وجود دارد.
برچسب بزنید طراحی شده برای علامت گذاری خطوط حذف شده از متن. یعنی اطلاعات منطقی خاصی را در مورد متن حمل می کند و به کلاس تگ های به اصطلاح معنایی HTML تعلق دارد. قالب بندی متن به صورت خط خطی هنگام اعمال - این هدف این تگ نیست، بلکه فقط نتیجه ماهیت منطقی آن است.
یک بار دیگر تکرار می‌کنم: اگر به ایدئولوژی زبان نشانه‌گذاری HTML اهمیتی نمی‌دهید و فقط جلوه بصری مهم است، فقط در نظر بگیرید که برچسب برای برجسته کردن متن در نظر گرفته شده است. اما نه یا . حداقل به همان دلایلی که شما می نویسید «حرفه گرایی» و نه «حرفه گرایی».
علاوه بر این، برچسب کاربردی تر از و . این می تواند اطلاعات اضافی در مورد متن را با استفاده از ویژگی های "cite" و "datetime" منتقل کند:
- صفت " نقل قول" در نظر گرفته شده است که حاوی پیوندی به یک سند باشد که دلیل حذف این متن و شاید جزئیات دیگری در مورد ویرایش آن را بیان کند.
- صفت " زمان قرار» برای نشان دادن تاریخ و زمان ویرایش این متن در نظر گرفته شده است.
اگر بخواهید متن را به عنوان خط خطی نمایش دهید، اما نمی خواهید آن را به عنوان حذف شده علامت گذاری کنید، چه کاری باید انجام دهید؟ همانطور که در بالا ذکر شد، CSS به شما کمک خواهد کرد. به طور خاص، ویژگی "text-decoration" که دارای مقدار "line-through" است. به عنوان مثال، به این صورت می توانید این کار را انجام دهید:
- خط خطی متن با استفاده از CSS → متن خط خورده CSS
کد خیلی زیاده؟ موافق. بنابراین، می توانید با قرار دادن دستورالعمل های CSS در یک فایل جداگانه، آن را کاهش دهید. به عنوان مثال، در آن می توانید کلاس متن خط خطی را به صورت زیر توصیف کنید:
S ( text-decoration: line-through; ) این به شما امکان می دهد در کد HTML مانند زیر بنویسید:
- متن خط خورده CSS → متن خط خورده CSS
این کد نیز طولانی تر از مورد است ، اما اگر می خواهید به وب معنایی بپیوندید، باید با چنین افزونگی کنار بیایید. خط زدن مبارک!
انتشارات قبلی:
