• اطلاعیه ها

    • Morteza

      باهم بسازیم: اطلس ووکامرس و وردپرس   14/07/96

      تاپیک ایجاد شده برای بحث در جهت ایجاد یک منبع، ویکی، صفحات توضیحی و یا بخش آموزشی جامع برای وردپرس و متعلقات مختلف آن است. لطفا جهت مشارکت در این بحث، ارائه پیشنهاد و یا انتقاد به تاپیک فوق مراجعه کنید. باهم بسازیم: اطلس ووکامرس و وردپرس
hami73

قرار دادن عکس زمینه برای چند ضلعی ها

3 پست در این موضوع قرار دارد

ارسال شده در (ویرایش شده)

سلام این کد مربوط به یک شش ضلعی می باشد:


#hexagon {
width: 100px;
height: 55px;
background: #075c9d;
position: relative;
}
#hexagon:before {
content: "";
position: absolute;
top: -25px;
left: 0; width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 25px solid #075c9d;
}
#hexagon:after {
content: "";
position: absolute;
bottom: -25px;
left: 0;
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 25px solid #075c9d;
}

چطوری میتونم درون پس زمینه این شش ضلعی عکس قرار بدم؟؟

البته روش زیر رو امتحان کردم جواب نداد:


#hexagon {
width: 100px;
height: 55px;
background: url(images/pic.png);
position: relative;
}
#hexagon:before {
content: "";
position: absolute;
top: -25px;
left: 0; width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 25px solid #075c9d;
}
#hexagon:after {
content: "";
position: absolute;
bottom: -25px;
left: 0;
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 25px solid #075c9d;
}

ویرایش شده در توسط hami73
0

به اشتراک گذاری این پست


لینک به پست

با توجه به این که border دارای after,before می باشد باید تصویر مورد نظر 3 قسمتی در همه المنت ها ذکر شود تا قابل نمایش باشد

2

به اشتراک گذاری این پست


لینک به پست

با توجه به این که border دارای after,before می باشد باید تصویر مورد نظر 3 قسمتی در همه المنت ها ذکر شود تا قابل نمایش باشد

داداش ممنونم اما وقتی به before و after خاصیت background رو میدم قبول نمیکنه!

میشه راهنمایی کنید،من زیاد وارد نیستم.

0

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری