میرے پاس یہ باس ہوتا تھا جو محبت کرتا تھا, محبت کرتا تھا, محبت کرتا تھا, محبت کرتا تھا الفاظ پر زور دینے کے لیے۔ WYSIWYG ایڈیٹرز کا استعمال کرنے سے پہلے یہ واپس آ گیا تھا اور مجھے اس گھٹیا کو ہینڈ کوڈ کرنا پڑے گا۔
<p> I used to have this boss who <em>loved</em>, <strong>loved</strong>, <strong><em>loved</em></strong>, <strong><em><u>loved</u></em></strong> to emphasize words.
</p>
(آئیے ان رنگوں میں نہ جائیں جو اس نے یکساں طور پر استعمال کیا تھا۔ موآر زور دینا۔)
اس تمام مارک اپ کو لکھنا کبھی اچھا محسوس نہیں ہوا۔ اس میں جو بھی کوشش ہوئی، یقیناً، جو بھی ہو۔ لیکن کیا ڈبل — یا اس سے زیادہ کے ساتھ اوورلوڈ مواد شامل کرنا بھی اچھا خیال ہے! - زور دیتا ہے؟
مختلف ٹیگز مختلف زور دیتے ہیں۔
شروع کرنے والوں کے لئے ، <strong>
اور <em>
ٹیگز مختلف استعمال کے لیے بنائے گئے ہیں۔ ہم نے انہیں HTML5 میں واپس حاصل کیا، جہاں:
تو <strong>
مواد کو اس لحاظ سے زیادہ وزن دیتا ہے کہ اس میں موجود مواد اہم یا فوری ہے۔ ایک انتباہ کے بارے میں سوچو:
: انتباہ مندرجہ ذیل مواد کو زبردست ہونے کی وجہ سے جھنڈا لگایا گیا ہے۔
یہ تک پہنچنے کے لئے پرکشش ہو سکتا ہے <em>
ایک ہی کام کرنے کے لئے. ترچھا متن آخر کار توجہ دلانے والا ہو سکتا ہے۔ لیکن یہ واقعی ایک اشارہ کے طور پر ہے جب اس میں موجود مواد کو پڑھتے وقت زیادہ زور دیا جائے۔ مثال کے طور پر، یہاں ایک ہی جملے کے دو ورژن ہیں جن میں مختلف مقامات پر زور دیا گیا ہے:
<p>I ate the <em>entire</em> plate of burritos.</p>
<p>I ate the entire <em>plate</em> of burritos.</p>
دونوں مثالیں زور پر زور دیتی ہیں، لیکن مختلف الفاظ پر۔ اور اگر آپ انہیں اونچی آواز میں پڑھیں تو وہ مختلف لگیں گے۔ وہ بناتا ہے۔ <em>
اپنی تحریر میں لہجے کا اظہار کرنے کا ایک بہترین طریقہ۔ یہ جملے کے معنی کو اس طرح بدل دیتا ہے۔ <strong>
نہیں کرتا.
بصری زور بمقابلہ سیمنٹک زور
مواد پر زور دیتے وقت یہ دو چیزیں ہیں جن کا آپ کو وزن کرنا ہوگا۔ جیسے، بہت ساری مثالیں ہیں جہاں آپ کو جملے کے معنی کو متاثر کیے بغیر مواد کو ترچھا کرنے کی ضرورت پڑ سکتی ہے۔ لیکن ان کو دوسرے ٹیگز کے ساتھ سنبھالا جا سکتا ہے جو ترچھا پیش کرتے ہیں:
<i>
: یہ کلاسک ہے! HTML5 سے پہلے، اس کا استعمال تمام جگہوں پر ترچھے کے ساتھ زور دینے کے لیے کیا جاتا تھا۔ اب، یہ خالصتاً معنوی معنی کو تبدیل کیے بغیر مواد کو بصری طور پر ترچھا کرنے کے لیے استعمال کیا جاتا ہے۔<cite>
: کسی حقیقت یا اعداد و شمار کے ماخذ کی نشاندہی کرنا۔ ("ذریعہ: سی ایس ایس - ٹیکنیکس")<address>
: رابطے کی معلومات کو نشان زد کرنے کے لیے استعمال کیا جاتا ہے، نہ صرف جسمانی پتے، بلکہ ای میل پتے اور فون نمبر جیسی چیزیں بھی۔ (
)
یہ اس کے ساتھ ایک ہی چیز جا رہا ہے <strong>
. اس کو اسٹائل ٹیکسٹ کے لیے استعمال کرنے کے بجائے جسے آپ بھاری نظر آنا چاہتے ہیں، کلاسک کا استعمال کرنا بہتر خیال ہے۔ <b>
جس مواد کی ضرورت نہیں ہے اسے اضافی اہمیت دینے سے بچنے کے لیے بولڈ فیسنگ کے لیے ٹیگ۔ اور یاد رکھیں، براؤزر کے ڈیفالٹ اسٹائل کی بدولت کچھ عناصر جیسے عنوانات پہلے ہی بولڈ میں پیش کیے گئے ہیں۔ اس سے بھی زیادہ زور دینے کی ضرورت نہیں ہے۔
زور دار مواد میں ترچھا استعمال کرنا (اور اس کے برعکس)
ایسے جائز معاملات ہیں جہاں آپ کو لائن کے کچھ حصے کو ترچھا کرنے کی ضرورت پڑ سکتی ہے جس پر پہلے ہی زور دیا گیا ہے۔ یا شاید تھوڑا سا متن پر زور ڈالیں جو پہلے ہی ترچھا ہے۔
ایک بلاک کوٹ ایک اچھی مثال ہوسکتی ہے۔ میں نے کافی بار دیکھا ہے جہاں وہ سٹائل کے لیے ترچھے ہیں، حالانکہ پہلے سے طے شدہ براؤزر کے انداز ایسا نہیں کرتے ہیں:
blockquote { font-style: italic;
}
اگر ہمیں اس بلاک کوٹ میں کسی فلم کے عنوان کا ذکر کرنے کی ضرورت ہو تو کیا ہوگا؟ اسے ترچھا کرنا چاہیے۔ تناؤ پر زور دینے کی ضرورت نہیں ہے، لہذا ایک <i>
ٹیگ کرے گا. لیکن جب کسی چیز کو پہلے ہی اس طرح پیش کیا جاتا ہے تو اسے ترچھا کرنا اب بھی عجیب ہے:
<blockquote> This movie’s opening weekend performance offers some insight in to its box office momentum as it fights to justify its enormous budget. In its first weekend, <i>Avatar: The Way of Water</i> made $134 million in North America alone and $435 million globally.
</blockquote>
ایسی صورت حال میں جہاں ہم اس طرح کے ترچھے مواد کے اندر کسی چیز کو ترچھا کر رہے ہیں، ہمیں یہ کرنا چاہیے ترچھے کو ہٹا دیں گھریلو عنصر سے… <i>
اس معاملے میں.
blockquote i { font-style: normal;
}
کنٹینر طرز کے سوالات ان تمام مثالوں کو پکڑنے کے لئے بہت مفید ہوگا اگر ہم انہیں حاصل کریں:
blockquote { container-name: quote; font-style: italic;
} @container quote (font-style: italic) { em, i, cite, address { font-style: normal; }
}
یہ چھوٹا ٹکڑا بلاک کوٹ کا اندازہ کرتا ہے کہ آیا یہ ہے یا نہیں۔ font-style
کرنے کے لئے مقرر کیا گیا ہے italic
. اگر یہ ہے، تو یہ یقینی بنائے گا کہ <em>
, <i>
, <cite>
، اور <address>
عناصر کو عام متن کے طور پر پیش کیا جاتا ہے، جبکہ اگر کوئی ہے تو معنوی معنی کو برقرار رکھتے ہوئے۔
لیکن زور کے اندر زور کی طرف واپس
میں گھوںسلا نہیں کروں گا۔ <strong>
کے اندر <em>
اس طرح:
<p>I ate the <em><strong>entire</strong></em> plate of burritos.</p>
…یا گھونسلہ <em>
کے اندر <strong>
اس کے بجائے:
<p>I ate the <em><strong>entire</strong></em> plate of burritos.</p>
رینڈرنگ ٹھیک ہے! اور اس سے کوئی فرق نہیں پڑتا کہ وہ کس ترتیب میں ہیں… کم از کم جدید براؤزرز میں۔ جینیفر کیرنن نے اس کا ذکر کیا۔ کچھ براؤزر صرف ٹیکسٹ کے قریب ٹیگ پیش کرتے ہیں۔، لیکن میں اپنے محدود ٹیسٹوں میں کہیں بھی اس سے ٹکرا نہیں پایا۔ لیکن کچھ دیکھنے کے لئے!
اس کی وجہ یہ ہے کہ میں زور کی ایک شکل کو دوسری شکل میں نہیں ڈالوں گا کیونکہ اس کی ضرورت نہیں ہے۔ گرائمر کا کوئی اصول نہیں ہے جو اسے طلب کرے۔ فجائیہ نکات کی طرح، تاکید کی ایک شکل کافی ہے، اور آپ کو وہی استعمال کرنا چاہیے جو آپ کے بعد کی چیز سے مماثل ہو چاہے وہ بصری، وزن، یا اعلانیہ تاکید ہو۔
اور اگرچہ کچھ اسکرین ریڈرز پر زور دیا گیا مواد کا اعلان کرنے کی صلاحیت رکھتے ہیں، لیکن وہ مارک اپ کو کسی اضافی اہمیت یا زور کے ساتھ نہیں پڑھیں گے۔ لہذا، جہاں تک میں بتا سکتا ہوں، کوئی اضافی قابل رسائی مراعات بھی نہیں۔
لیکن میں واقعی میں تمام زور چاہتا ہوں!
اگر آپ اس پوزیشن میں ہیں جہاں آپ کا باس میرے جیسا ہے اور چاہتا ہے۔ ALL la زور، میں زور کی قسم کے لیے صحیح HTML ٹیگ تک پہنچوں گا، پھر باقی اسٹائلز کو ٹیگز کے مرکب کے ساتھ لاگو کروں گا جو سی ایس ایس کے ساتھ سیمنٹکس کو متاثر نہیں کرتے ہیں تاکہ کسی بھی چیز کے اکاؤنٹ میں مدد ملے جو براؤزر کے اسٹائلز کو سنبھال نہیں سکتے ہیں۔
<style> /* If `em` contains `b` or `u` tags */ em:has(b, u) { color: #f8a100; }
</style> <p> I used to have this boss who <em>loved</em>, <strong>loved</strong>, <strong><em>loved</em></strong>, <strong><em><u>loved</u></em></strong> to emphasize words.
</p>
میں اس کے ساتھ بھی کر سکتا ہوں۔ <strong>
ٹیگ بھی ایک دفاعی اقدام کے طور پر:
/* If `em` contains `b` or `u` tags */
em:has(b, u),
/* If `strong` contains `em` or `u` tags */
strong:has(i, u) { color: #f8a100;
}
جب تک ہم دفاعی کھیل کر رہے ہیں، ہم ان غلطیوں کی نشاندہی کر سکتے ہیں جہاں پر زوروں کو سرخ یا کسی اور چیز میں نمایاں کر کے زور کے اندر اندر رکھا گیا ہے:
/* Highlight semantic emphases within semantic emphases */
em:has(strong),
strong:has(em) { background: hsl(0deg 50% 50% / .25); border: 1px dashed hsl(0deg 50% 50% / .25);
}
پھر میں شاید آخری حصے سے وہ ٹکڑا استعمال کروں گا جو کسی عنصر سے پہلے سے طے شدہ اٹالک اسٹائل کو ہٹاتا ہے جب اسے کسی دوسرے اٹالک عنصر میں داخل کیا جاتا ہے۔
اور کچھ؟
Mayyyyybe:
- SEO سے چلنے والا مواد اور PR کی تقسیم۔ آج ہی بڑھا دیں۔
- پلیٹو بلاک چین۔ Web3 Metaverse Intelligence. علم میں اضافہ۔ یہاں تک رسائی حاصل کریں۔
- ماخذ: https://css-tricks.com/the-double-emphasis-thing/
- 1
- 11
- 7
- 9
- 98
- a
- رسائی پذیری
- اکاؤنٹ
- ایڈیشنل
- پتہ
- پتے
- پر اثر انداز
- کو متاثر
- کے بعد
- تمام
- اکیلے
- پہلے ہی
- امریکہ
- اور
- کا اعلان کیا ہے
- اعلان
- ایک اور
- کہیں
- کا اطلاق کریں
- اوتار
- واپس
- پس منظر
- کیونکہ
- اس سے پہلے
- کیا جا رہا ہے
- بہتر
- بٹ
- جرات مندانہ
- سرحد
- BOSS
- باکس
- باکس آفس
- براؤزر
- براؤزر
- بجٹ
- کالز
- صلاحیت رکھتا
- کیس
- مقدمات
- تبدیلیاں
- تبدیل کرنے
- کلاسک
- رنگ
- رابطہ کریں
- پر مشتمل ہے
- مواد
- CSS
- پہلے سے طے شدہ
- دفاع
- دفاعی
- ڈیزائن
- مختلف
- نہیں کرتا
- نہیں
- دوگنا
- کوشش
- یا تو
- عناصر
- ای میل
- زور
- پر زور
- پر زور دیا
- بہت بڑا
- کافی
- پوری
- نقائص
- بھی
- مثال کے طور پر
- مثال کے طور پر
- ایکسپریس
- اضافی
- لڑائی
- اعداد و شمار
- پہلا
- جھنڈا لگا ہوا
- کے بعد
- فارم
- سے
- حاصل
- فراہم کرتا ہے
- دے
- عالمی سطح پر
- Go
- جا
- اچھا
- عظیم
- ہینڈل
- مدد
- یہاں
- نمایاں کریں
- اجاگر کرنا۔
- HTML
- HTTPS
- خیال
- شناخت
- اہمیت
- اہم
- in
- معلومات
- بصیرت
- کے بجائے
- IT
- جینیفر
- آخری
- لمیٹڈ
- لائن
- تھوڑا
- مقامات
- لانگ
- دیکھو
- بنا
- بنا
- بناتا ہے
- نشان
- معاملہ
- مطلب
- پیمائش
- ذکر ہے
- شاید
- دس لاکھ
- جدید
- رفتار
- زیادہ
- فلم
- فلم
- نیب
- ضرورت ہے
- گھوںسلا
- عام
- شمالی
- شمالی امریکہ
- تعداد
- تجویز
- دفتر
- ایک
- کھولنے
- حکم
- دیگر
- حصہ
- کارکردگی
- مراعات
- فون
- جسمانی
- مقام
- پلاٹا
- افلاطون ڈیٹا انٹیلی جنس
- پلیٹو ڈیٹا
- کھیل
- کافی مقدار
- پوائنٹس
- پوزیشن
- شاید
- محفوظ
- خالص
- تک پہنچنے
- پڑھیں
- قارئین
- وجہ
- ریڈ
- یاد
- رینڈرنگ
- باقی
- برقرار رکھنے
- حکمرانی
- اسی
- سکرین
- اسکرین ریڈرز
- سیکشن
- سیمنٹ
- احساس
- سزا
- مقرر
- ہونا چاہئے
- صرف
- صورتحال
- So
- کچھ
- کچھ
- آواز
- ماخذ
- ابھی تک
- کشیدگی
- مضبوط
- سٹائل
- پتہ چلتا ہے
- سپر
- سمجھا
- TAG
- ٹیسٹ
- ۔
- ماخذ
- بات
- چیزیں
- اوقات
- عنوان
- کرنے کے لئے
- سر
- بھی
- سچ
- فوری
- استعمال کی شرائط
- انتباہ
- دیکھیئے
- ہفتے کے آخر میں
- وزن
- وزن
- کیا
- چاہے
- جبکہ
- ڈبلیو
- گے
- کے اندر
- بغیر
- الفاظ
- گا
- تحریری طور پر
- تم
- اور
- زیفیرنیٹ