سی ایس ایس ابتدائی کیپس

سی ایس ایس اور تصاویر کا استعمال کرتے ہوئے فینسی ابتدائی کیپس کیسے بنائیں

جانیں کہ آپ پیراگراف کے لئے پسند ابتدائی کیپس تخلیق کرنے کے لئے سی ایس ایس کا استعمال کیسے کریں. آپ کی ابتدائی ٹوپی کے لئے گرافیکل تصویر استعمال کرنے کے لئے ایک سادہ تصویر متبادل تکنیک بھی ہے.

ابتدائی کیپس کے بنیادی طرزیں

دستاویزات میں ابتدائی ٹوپیاں کی تین بنیادی شیلیوں ہیں:

• اٹھایا - سب سے زیادہ عام، جہاں پہلا خط بڑا ہے اور موجودہ متن کے ساتھ ہی ایک ہی لائن پر ہے.
• گرا دیا - یہ بھی کافی عام ہے، جہاں پہلا خط بڑا ہے اور متن کی پہلی سطر کے نیچے نیچے گر گیا ہے. مندرجہ ذیل متن اس کے ارد گرد floats.
• قریبی جگہ - جہاں باقی خط کے باقی خطوط کے قریب ایک کالم میں پہلا خط ہے. ویب ڈیزائن سے پرنٹ میں یہ زیادہ عام ہے.

ابتدائی کیپس یا ڈراپ ٹوپیاں بہت واقف ہیں. وہ دوسری صورت میں طویل اور بورنگ کے اسپانس تیار کرنے کا ایک بڑا طریقہ ہے. اور سی ایس ایس پراپرٹی کے ساتھ: پہلا خط، آپ آسانی سے اپنے پہلے حروف فانسیر بنانے کے لئے کس طرح وضاحت کر سکتے ہیں.

ایک سادہ ابتدائی کیپ بنائیں

آپ کو ایک آسان اٹھایا ابتدائی ٹوپی تخلیق کرنے کی ضرورت ہے، آپ کے پیراگراف کے پہلے خط کو پہلے خط چھاسو عنصر کے ساتھ سائز میں بڑا کرنا ہے.

پی: پہلا خط {فونٹ سائز: 3em؛ }

لیکن بہت سے براؤزر یہ دیکھتے ہیں کہ پہلا خط لائن کے باقی متن کے مقابلے میں بڑا ہے، لہذا وہ اس کے پہلے خط کے لۓ معتبر برابر بناتے ہیں، باقی لائن نہیں. خوش قسمتی سے، یہ پہلی لائن چھاسو عنصر اور لائن اونچائی کی جائیداد کے ساتھ حل کرنا آسان ہے:

پی: پہلا خط {فونٹ سائز: 3em؛ } p: پہلی لائن {لائن اونچائی: 1em؛ }

اپنے دستاویز کے اندر اندر اونچائی کے ساتھ کھیل کریں جب تک کہ آپ اپنے متن کا صحیح سائز ڈھونڈیں.

آپ کی ابتدائی کیپ کے ساتھ کھیلیں

ایک بار آپ سمجھتے ہیں کہ کس طرح ابتدائی ٹوپی پیدا کرنے کے لۓ، آپ اسے پسند کرنے کے لئے پسند کپڑے میں کپڑے پہن سکتے ہیں. رنگ، پس منظر کے رنگ، سرحدوں، یا جو کچھ بھی آپ کی پسند پر حملہ کرتے ہیں کھیلنے کے ساتھ. ایک سادہ انداز یہ ہے کہ آپ کے فونٹ اور رنگ کے پس منظر کا رنگ صرف پہلے خط کے لئے ریورس کرنا ہے.

پی: پہلا خط {فونٹ سائز: 300٪؛ پس منظر کا رنگ: # 000؛ رنگ: #fff؛ } p: پہلی لائن {لائن اونچائی: 100٪؛ }

ایک اور چیلنج پہلی سطر کا مرکز ہے. یہ سی ایس ایس کے ساتھ مشکل ہوسکتا ہے، کیونکہ آپ کی ترتیب لچکدار ہے تو متن کی لائن کے وسط مختلف ہوسکتا ہے. لیکن کچھ کے ساتھ اقدار کے ساتھ کھیل رہا ہے، آپ اپنی پہلی لائن کو اندرونی طور پر ظاہر کرنے کے لئے کافی اندراج کر سکتے ہیں. صرف پیراگراف کے ٹیکسٹ انڈنٹ پر فی صد کے ساتھ کھیلنے کے لۓ یہ درست نہیں ہے جب تک کہ:

پی: پہلا خط {فونٹ سائز: 300٪؛ پس منظر کا رنگ: # 000؛ رنگ: #fff؛ } p: پہلی لائن {لائن اونچائی: 100٪؛ } p {متن انڈسٹری: 45٪ ؛ }

عجائب ابتدائی کیپس سی ایس ایس کے ساتھ مشکل ہیں

پرجوش ابتدائی ٹوپیاں سی ایس ایس کے ساتھ مشکل ہوسکتا ہے کیونکہ مختلف براؤزر مختلف فانٹ کو ظاہر کرتی ہیں. سی ایس ایس میں ایک ملحقہ کیپ بنانے کے پیچھے خیال یہ ہے کہ پہلی سطر پر ٹیکسٹ انڈنٹ کی جائیداد کو اسے منفی قدر (بائیں طرف) کو دھکا دینا ہے. آپ کو کچھ پیسے کی پیراگراف کے بائیں حرف کو بھی تبدیل کرنے کی ضرورت ہوگی. ان نمبروں کے ساتھ کھیلیں جب تک پیراگراف اچھا لگے.

p {متن انڈین: -2.5em؛ مارجن بائیں: 3em؛ } p: پہلا خط {فونٹ سائز: 3em؛ } p: پہلی لائن {لائن اونچائی: 100٪؛ }

واقعی فانسسی ابتدائی کیپس حاصل کرنا

فانسسی ابتدائی کیپ تخلیق کرنے کا بہترین طریقہ فونٹ کو ایک اور آرائشی فونٹ فیملی میں تبدیل کرنا ہے. اگر آپ عام فانٹ کے بعد فونٹ کی ایک سیریز کا استعمال کرتے ہیں تو، یہ اس بات کی ضمانت میں مدد ملے گی کہ آپ کی ابتدائی ٹوپی اچھی طرح سے ظاہر ہوتا ہے تاکہ آپ کے گاہکوں کو یہ دیکھ سکیں، بغیر رسائی اور استعمال کے مسائل کو حل کرنے کے.

پی: پہلا خط {فونٹ سائز: 3em؛ فونٹ-خاندان: "ایڈورڈین اسکرپٹ آئی ٹی سی"، "برش اسکرپٹ MT"، کرسر؛ } p: پہلی لائن {لائن اونچائی: 100٪؛ }

اور، ہمیشہ کی طرح، آپ ان تمام تجاویز کو ایک دوسرے کے ساتھ ڈال سکتے ہیں جو ابتدائی ٹوپی تخلیق کرتے ہیں جو آپ کے پیراگراف میں اشتھارات کی طرز.

ایک گرافیکل ابتدائی کیپ کا استعمال کرتے ہوئے

اگر، اس کے بعد، آپ اب بھی یہ پسند نہیں کرتے کہ آپ کی ابتدائی ٹوپیاں صفحے پر نظر آئیں تو، آپ گرافکس کو اس کے لۓ لے سکتے ہیں جو آپ کو تلاش کر رہے ہیں اس کا صحیح اثر حاصل کرنے کے لۓ. لیکن آپ گرافکس پر براہ راست منتقل کرنے کا فیصلہ کرنے سے پہلے، آپ کو اس طریقہ کار کی خرابیوں سے آگاہ ہونا چاہئے:

• تصاویر کے بغیر گاہکوں کو ابتدائی ٹوپی نہیں ملتی، اور شاید پوشیدہ ٹیکسٹ نہیں دیکھ سکے جس کی تصویر تصویر بدل رہی ہے. یہ پیراگراف قابل رسائی بنا سکتا ہے، یا پڑھنے کے لئے بہت مشکل ہے.
• تصاویر ہمیشہ صفحے کے ڈاؤن لوڈ ہونے والے وقت میں شامل ہوتے ہیں. اگر آپ کے پاس بہت ابتدائی ٹوپیاں موجود ہیں تو آپ بہت زیادہ لوگوں کو محسوس کرنے کے لئے ڈاؤن لوڈ کردہ وقت کو بڑھا سکتے ہیں.
• کچھ براؤزرز پوشیدہ پہلے خط اور تصویر دونوں کو دکھائے جائیں گے - جو پیراگراف متن کی نظر میں عجیب بنا سکتے ہیں.
• اس اختیار کو خود کار طریقے سے خودکار کرنے کے لئے بہت مشکل ہے، کیونکہ آپ کو یہ جاننا ہوگا کہ پہلا خط کیا ہے تاکہ آپ صحیح گرافک کا استعمال کریں. لہذا، ہر بار پیراگراف میں ترمیم کی جاتی ہے، آپ کو ایک نیا گرافک بنانے کی ضرورت ہوسکتی ہے.

سب سے پہلے، آپ کو پہلے خط کا گرافک بنانے کی ضرورت ہے. میں نے فوٹوشاپ کا استعمال کیا تھا جس میں فونٹ "ایڈیڈین اسکرپٹ آئی ٹی سی" کے ساتھ خط L. میں نے اسے بہت بڑا بنایا - 300pt سائز میں. اس کے بعد میں نے تصویر کے ارد گرد کم سے کم کم از کم تصویر تصویر کو کردی اور تصویر کی چوڑائی اور اونچائی کا ذکر کیا.

پھر میں نے اپنے پیراگراف کے لئے ایک کلاس "کیپ" تشکیل کی. یہی ہے کہ میں کس طرح استعمال کرنے کے لئے تصویر، معروف (لائن اونچائی)، اور اسی طرح کی وضاحت کرتا ہوں.

آپ کو پیراگراف کے ٹیکسٹ انڈنٹ اور پیڈنگ ٹاپ مقرر کرنے کیلئے تصویر چوڑائی اور اونچائی کا استعمال کرنا ہوگا. میری ایل تصویر کے لئے، مجھے 95 پییکس انڈین اور 72 پی ایکس پیڈنگ کی ضرورت تھی.

پی سی ایل ایل {لائن اونچائی: 1em؛ پس منظر کی تصویر: url (capL.gif)؛ پس منظر دوبارہ: کوئی دوبارہ نہیں؛ ٹیکسٹ انڈنٹ: 95px؛ padding-top: 72px؛ }

لیکن یہ سب نہیں ہے. اگر آپ اسے وہاں چھوڑ دیتے ہیں تو پھر پہلے خط میں پیراگراف میں نقل کیا جاسکتا ہے. سب سے پہلے گرافک کے ساتھ، پھر متن میں. لہذا، میں نے اس ابتدائی عنصر کے ارد گرد ایک کلاس کو "ابتدائی" کے ساتھ شامل کیا - اور اس خط کو ظاہر نہیں کرنے کے لئے براؤزر سے کہا:

span.initial {ڈسپلے: کوئی نہیں؛ }

اور گرافک پھر ظاہر ہوتا ہے. آپ متن کے اندر داخل ہونے والے متن کو سننے کے لۓ متن پیراگراف کے ساتھ کھیل سکتے ہیں، لیکن آپ اسے ظاہر کرنا چاہتے ہیں.