اسٽائل هول هيل (افريق رول) ٽيگ

HR ٽيگ سان ويب صفحن تي دلچسپ لڳندڙ سٽون ٺاهڻ

جيڪڏهن توهان افريٽ کي شامل ڪرڻ جي ضرورت آهي، توهان جي ويب سائيٽن ڏانهن ڌاريندڙ طرز واري لائنون، توهان وٽ ڪجھه اختياب آهن. توھان انھن تصويرن جي حقيقي تصوير فائلن کي پنھنجي صفحي ڏانھن شامل ڪري سگھو ٿا، پر اھو اوھان کي توھان جي برائوزر جي انهن فائلن کي ٻيهر حاصل ڪرڻ ۽ لوڊ ڪرڻ جي ضرورت آھي، جيڪو سائيٽ جي ڪارڪردگي تي منفي اثر ڪري سگھي ٿو.

توهان سي ايس ايس جي ملڪيت ملڪيت کي استعمال ڪري سگهون ٿا جيڪي سرحدون شامل آهن جيڪي سٽون کي مٿين طور تي يا هڪ عنصر جي هيٺئين حصي ۾، مؤثر انداز سان توهان جي جدا ڪندڙ لائن کي ٺاهيندا آهن.

آخرڪار، توهان افقي قاعدي لاء HTML عنصر استعمال ڪري سگهو ٿا

افقي قاعده عنصر

جيڪڏهن توهان ڪنهن ويب پيج تي هڪ عنصر ڪيو آهي، توهان ممڪن ڪيو ته اهي لڪيرون ڊسپلي جو ڊفالٽ انداز نموني نه هوندا آهن. ان جو مطلب اهو آهي ته توهان انهن عناصر جي بصري ظهور کي ترتيب ڏيڻ لاء سي ايس سي ڪرڻ جي ضرورت آهي انهي سان گڏوگڏ توهان پنهنجي سائيٽ کي نظر انداز ڪرڻ چاهيو ٿا.

هڪ بنيادي HR جي ٽيگ کي ڏيکاريو ويو آهي جيڪو برائوزر ان کي ڊسپلي ڪرڻ چاهيندو آهي. جديد برائوزر عام طور تي اڻڄاتل ایچ آر ٽيگ کي 100٪ چوڪائي، 2px جي ڊيگهه، ۽ ڪاروين ۾ 3D سرحد ظاهر ڪن ٿا.

هتي جديد HR عنصر جو هڪ مثال آهي يا توهان هن تصوير ۾ ڏسي سگهو ٿا ته جديد برائوزرن ۾ ڪيئن غير يقيني انساني نظر اچي ٿو.

چوٿون ۽ ڊيگهه جهڙا اڪثريت برائوزرز آهن

صرف شاليون جيڪي ويب برائوزرن جي وچ ۾ جهڙي ريت آهن چوٿون ۽ انداز. اهي وضاحت ڪئين وڏي لائن هوندي. جيڪڏهن توهان چوڻي ۽ اوچائي وضاحت نه ڪيو آهي ته ڊفالٽ چوٿين 100٪ ۽ ڊفالٽ جي ڊيگهه 2px آهي.

هن مثال ۾ چوٿين عنصر جو چوٿين 50٪ آهي (انهن سڀني مثالن ۾ ان لائن شالن ۾ هيٺ ڏنل مثالن جو نوٽيس. هڪ پيداوار جي جوڙجڪ ۾، اهي انداز توهان جي سڀني صفحن ۾ انتظامي آسانيء جي لاء هڪ خارجي طرز شيٽ ۾ لکيل هجن):

انداز = "چوڑائي: 50٪؛">

۽ هن مثال ۾ ڊيگهه 2em آهي:

انداز = "اوچائي: 2em؛">

سرحدن کي تبديل ڪرڻ ۾ چيلنج ٿي سگهي ٿو

جديد برائوزر ۾، برائوزر سرحد کي ترتيب ڏيندي ڪندي لائن ٺاهي ٿو. تنهن ڪري جيڪڏهن سرحد سرحد جي ملڪيت سان هٽايو، اهو لڪير صفحي تي غائب ٿيندو. جئين ته ڏسي سگهو ٿا (سٺو، توهان کي ڪجهه به نه ڏسي، جيئن لائين لڪير ٿيندي ويندي) هن مثال ۾:

انداز = "سرحد: ٻيو نه؛">

سرحد جي سائيز، رنگ ۽ انداز کي ترتيب ڏيڻ واري لائن نظر مختلف ٺاهي ۽ سڀني کي جديد برائوزر ۾ ساڳيو اثر ٿيندو. مثال طور، هن مظاهري ۾ سرحد ڳاڙهو، ڀريل آهي ۽ 1px ويڪر آهي:

انداز = "سرحد: 1px ڊشٽل # 000؛">

پر جيڪڏهن توهان سرحد ۽ اونچين کي تبديل ڪريو ٿا، انهن جو انداز ٿورو جديد برائوزرن ۾ بلڪل مختلف آهي، جيڪي جديد برائوزرن ۾ آهن. جئين ته توهان هن مثال ۾ ڏسي سگهو ٿا، جيڪڏهن توهان IE7 ۽ هيٺ ڏنل ڏسڻ ۾ ايندا (هڪ برائوزر جيڪو فوري طور تي ختم ڪيل آهي ۽ هاڻي Microsoft جي طرفان حمايت نه ڪئي) هڪ بيزاري اندروني لڪير آهي جيڪا ٻين برائوزرز ۾ ظاهر نه ڪندو آهي (IE8 ۽ اپ شامل آهن) :

انداز = "قد، 1.5"؛ چوٽي: 25em؛ سرحد: 1px ڪروڙ # 000؛ ">

جيڪي قديم آڳاٽا برائوزر اڄ تائين ويب ڊزائن ۾ گهڻو پريشان نه آهن، ڇاڪاڻ ته اهي انهن کي گهڻو ڪري وڌيڪ جديد اختيارن سان مٽايو ويو آهي.

پس منظر جي تصوير سان آرائشي لائين ٺاهڻ

رنگ جي بدران، توهان پنهنجي HR لاء هڪ پس منظر واري تصوير وضاحت ڪري سگهو ٿا جيئن ته اهو بلڪل ظاهر آهي جيئن توهان ان کي چاهيو ٿا، پر اڃا تائين توهان جي مارڪ اپ ۾ بنيادي طور ڏيکاري ٿو.

هن مثال ۾ اسان هڪ تصوير ڏٺي جيڪا ٽن ويڪري جون لائينون آهن. ان کي پس منظر واري تصوير وانگر ڪو به ورجائڻ سان، اهو مواد ۾ هڪ وقف ٺاهي ٿو جيڪا تقريبن ڪتابن ۾ ڏسڻ وانگر لڳندي آهي:

اسڪرپٽ = "اونچائي: 20px؛ پس منظر: # ايفف يو آر ايل (aa010307.gif) اسڪرپٽ ڪوڊ مرڪز؛ سرحد: ٻيو؛">

HR عناصر کي تبديل ڪرڻ

CSS3 سان، توهان پڻ پنهنجي لائنون وڌيڪ دلچسپ ڪري سگهو ٿا. HR HR عنصر روايتي طور افقي قطار آھي، پر سي ايس ايس سان ملڪيت تبديل ڪري ٿي، توھان ڪھڙو تبديلي ڪري سگھو ٿا ڪھڙي طرح اھي. HR HR عنصر تي هڪ پسندیدہ تبديل ٿيندڙ گردش کي تبديل ڪرڻ آهي.

توھان پنھنجي HR عنصر کي گھمائي سگھو ٿا تہ اھو ھڪڙو ننڍڙو آھي:

ڪلا {
-موز ٽرانس: گھمڻ (10 ڊيگ)؛
ويڪرائيٽ ٽرانس: گھمڻ (10 ڊيگ)؛
-وٽا تبديلي: گھمڻ (10deg)؛
وجھي تبديلي: گھمڻ (10deg)؛
مٽايو: گھمڻ (10deg)؛
}

يا توهان ان کي گھمائي سگھو ٿا ته اهو مڪمل طور عمودي آهي.

ڪلا {
-موز ٽرانس: گھمڻ (90 ڊيگ)؛
ڇٽائڻ واري تبديلي: گھمندڙ (90deg)؛
-وٽا تبديلي: گھمڻ (90deg)؛
وجھي تبديلي: گھمڻ (90deg)؛
تبديل ڪريو: گھمڻ (90deg)؛
}

ياد رهي ته اهو هن آرٽيڪل ۾ هن جي موجوده جڳهه تي ٻڌل HR کي گھمائيندو آهي، تنهنڪري توهان ان کي حاصل ڪرڻ لاء پوزيشن بهتر ڪرڻ جي ضرورت پوندي جتي توهان چاهيو ٿا. اهو ڊزائن ڏانهن عمودي لائنون شامل ڪرڻ لاء هن کي استعمال ڪرڻ جي سفارش ناهي، پر اهو هڪ دلچسپ اثر حاصل ڪرڻ جو هڪ طريقو آهي.

توهان جي صفحن تي ليڪون حاصل ڪرڻ جو ٻيو طريقو

هڪڙي ڳالهه اها آهي ته ڪجهه ماڻهو HR جي عنصر کي استعمال ڪرڻ بدران ٻين عناصر جي سرحدن تي عمل ڪرڻ آهي. پر ڪڏهن ڪڏهن انساني طور تي سرحدون سيٽ ڪرڻ جي ڪوشش ڪرڻ کان وڌيڪ هڪٻئي کان وڌيڪ آسان ۽ آسان استعمال آهي. ڪجهه برائوزر جي دٻي جا ماڊل مسئلا حدون ٺاهي سگھجن ٿيون.