رسم شکل در سی اس اس

این تاپیک 4 پاسخ و 3 مشارکت کننده دارد . آخرین آپدیت توسط :  hamed_z2001 ،‏ 2 سال و 6 ماه پیش .

این تاپیک تاکنون 562 بازدید داشته است .

نویسنده پست
سه شنبه ، 27 می 2014     12:26 ق.ظ #


hamed_z2001

Subscriber
156 پست51 تاپیک

سلام دوستان
من میخوام بردری به صورت عکس زیر رسم کنم اما نمیتونم
میدونم که باید از دو تا div تودرتو استفاده کنم
ولی لبه دیو داخلی رو نمیدونم چه جوری درست کنم
ممنون

پیوست ها:
You must be logged in to view attached files.
1  تشکر
سه شنبه ، 27 می 2014     12:02 ب.ظ #


محمد اسفندیاری

Authorplus
VIP
817 پست10 تاپیک

دوست عزیز میتونی در فتوشاپ یک مثلث درست کنی و بعد بیاری و پس زمینه این div قرارش بدی و بعد با background-position اونو بزاری سمت راست و پایین..........شاید بتونی همین کارارو با استفاده از Canvas انجام بدی ........من یکی انجام دادم ولی نمیدونم بدرد کارت بخوره یا نه!!!!کدهاش به این صورته :

در فایل html اینارو قرار بده :

حالا در فایل Javascript اینها رو قرار بده :

با بازی کردن با عددهای بالا میتونی که هر شکلی که دوس داشتی بسازی ولی بنظر من از همون فتوشاپ استفاده کنی بهتر باشه..........یک Screenshot هم از چیزی که ساختم پیوست کردم.......یا علی

پیوست ها:
You must be logged in to view attached files.
2  تشکر
سه شنبه ، 27 می 2014     6:44 ب.ظ #


s.alifarrokh

Subscriber
396 پست119 تاپیک

سلام

همچنین میتونید بدون استفاده از جاوااسکرپیت و جی کوئری و فتوشاپ این کارو بکنید.اول با استفاده از استایل overflow:hiden معلوم میکنید که تمام چیزای داخل تگ پدر که ازش می زنن بیرون نشون داده نشن و بعد یه  div رو با استفاده از خاصیت ترنسفرم در css می چرخونین و میذارینش اون گوشه.ایمجوری نه فتوشاپ میخواد نه جاوااسکریپت.

1  تشکر
سه شنبه ، 27 می 2014     7:20 ب.ظ #


محمد اسفندیاری

Authorplus
VIP
817 پست10 تاپیک

دوست عزیز اینم در نظر داشته باش که ترنسفورم در CSS3 اومده و در مرورگرهای قدیمی تر ساپورت نمیشه.......آره اینم راهه خوبی هست......در ذهن خودم هم بود.......یا علی

3  تشکر
چهار شنبه ، 28 می 2014     2:51 ب.ظ #


hamed_z2001

Subscriber
156 پست51 تاپیک

ممنون از دوستان بابت جوابهاشون.فکر میکنم با ترنسفر بهتر باشه ...

متشکرم

0  تشکر
پست 1 تا 5 (از مجموع 5 پست)

برای پاسخ دادن به این تاپیک باید وارد سایت شوید .