PDA

توجه ! این یک نسخه آرشیو شده میباشد و در این حالت شما عکسی را مشاهده نمیکنید برای مشاهده کامل متن و عکسها بر روی لینک مقابل کلیک کنید : تقسیم کردن border در css به دو قسمت



SaeedFazlollahzadeh
August 3rd, 2017, 15:03
سلام
یه متن داریم که border داره چهار طرفه
بعد می خوام این بوردر دو طرفش (بالا و پایین) رو مثل عکس کنم:
http://up.vbiran.ir/uploads/40977150175595843796_sit-border.png

https://stackoverflow.com/questions/17391039/css-how-can-i-divide-a-border-into-two-lines
این رو هم دیدم، نتونستم خوب درستش کنم

خود css کدی داره که مستقیما این کار رو کرد؟ یا باید با html و css ترکیبی کار کرد؟

تشکر

data20
August 3rd, 2017, 21:25
سلام
مثال اول یه کم تغییر بدید شبیه چیزی میشه که می خواید :

http://jsfiddle.net/v9f2d/20

persiandroid
August 4th, 2017, 15:59
بین فاصله هایی خالی Border تکست قرار میگرد؟ مانند قسمت اطلاعات تماس لینک زیر؟
http://www.parsnia.com/contact

kiavaco
August 4th, 2017, 16:36
http://jsfiddle.net/v9f2d/20/

SaeedFazlollahzadeh
August 4th, 2017, 22:24
سلام
مثال اول یه کم تغییر بدید شبیه چیزی میشه که می خواید :

http://jsfiddle.net/v9f2d/20
تشکر، اما یه چیزی که نتونستم درستش کنم این هست:
من یه کادر دیگه ای درست کردم قبلا، اما وقتی این کدها رو می ذارم، میافته زیر کادر من
z-index هم بهش دادم 100000000000000 اما خب نشدش:
http://up.vbiran.ir/uploads/134661501869174211_boxekhali.png
این شکلی شده. یعنی لینکی که پست اول دادم این خط رو اضافه می کرده، اما مشکل اصلیم همین هست که الان عکس دادم و نتونستم این رو درستش کنم.

بین فاصله هایی خالی Border تکست قرار میگرد؟ مانند قسمت اطلاعات تماس لینک زیر؟
http://www.parsnia.com/contact
تشکر، اما خیر منظورم این نیست. صرفا یه فاصله میخوام بندازم که دوستان زحمت لینکش رو کشیدن.

http://jsfiddle.net/v9f2d/20/
تشکر. نقل قول اول در پاسخ به شما هم هست و اگر امکانش هست نگاهی کنید بهش.

data20
August 4th, 2017, 23:06
با عرض پوزش بدون دیدن کل کد نمی تونم بگم اشکال کجا میتونه باشه
ولی با توجه به عکس مقدار top در before باید برابر با height باشه و مقدار bottom در after مجدد باید برابر height خودش باشه تا دقیقا روی border بیفته به طور مثال :
http://jsfiddle.net/v9f2d/21/

SaeedFazlollahzadeh
August 4th, 2017, 23:42
با عرض پوزش بدون دیدن کل کد نمی تونم بگم اشکال کجا میتونه باشه
ولی با توجه به عکس مقدار top در before باید برابر با height باشه و مقدار bottom در after مجدد باید برابر height خودش باشه تا دقیقا روی border بیفته به طور مثال :
http://jsfiddle.net/v9f2d/21/
لینک خصوصی ارسال شد

تشکر

- - - Updated - - -

متوجه شدم باید چه کنم
اشتباهم این بوده که این کد رو در همون class که border تنظیم کرده بودم می ذاشتم
یه کلاس قبلش این کد رو گذاشتم و اوکی شده

تشکر از سه عزیزی که راهنمایی کردن، خصوصا @data20 که بیشتر