کدهای جذاب و دیدنی : ساخت ظاهر یک حیوان تنها با کدهای HTML



visibility  
mode_comment   ۱۰

در این قسمت میخوام کدی رو بهتون نشون بدم که متعجب میشین. این تصویری که در زیر میبینید ، توسط یک نفر با HTML ساخته شده. که کار خیلی سختی بنظر میاد. این کار توسط تقریبا 50000 خط HTML انجام شده و حجم اون هم 3.5MB هست. بهمین دلیل اونو در آخر همین مطلب براتون قرار میدم.

cow

 

همونطور که در کدها میبینید ، نقش اصلی رو جدول و ستون و ردیفها ایفا میکنن.

امیدوارم لذت برده باشین.

موفق باشید. یا علی

7Learn Experts
comment دیدگاه کاربران
علی replyپاسخ

اولش تعجب کردم و فکر کردم که با استفاده از CSS اشکال و طرح ها رو درست کرده باشه ولی بعدش که دانلود کردم متوجه شدم که با استفاده از یک جدول و سطر و ستون ها پیکسل های تصویر اولیه رو بازسازی کرده. یک Class برای PHP هم نوشته شده بود که عکس هارو با استفاده از خاصیت box-shadow در CSS به صورت یک فایل CSS و HTML در می آورد.

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

چه جالب
موفق باشید

hassany replyپاسخ

خوش به حال اون یه نفر

blogeshg replyپاسخ

واقعا خیلی جالب کسی این رو درست کرده واقعا شاهکار کرده

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

آره کاره جالبی انجام داده
موفق باشید

رامین replyپاسخ

ببخشید آموزش یه همچین شکلی را به صورت فیلم آموزشی در سایت قرار نمی دهید
این شکل هم نباشه عیب نداره ولی یه شکل چیزی باشه هر چقدر درست کردن تصویر آسون تر باشه بهتر

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

راستش این شکل ساختنش کاری نداره ولی حوصله میخواد
باید هی چپ و راست و کوچک و بزرگ کنی هر td رو و رنگ هر td رو هم مناسب قرار بدی….اینجا که نمیشه توضیح داد شاید در نت بتونین آموزشی برای ساخت چنین مواردی پیدا کنید
از یکی از دوستان هم شنیدم که یک کتابخانه PHP هست که یک تصویر رو میگیره و اونو به این شکل در میاره……فقط در این حد میدونم ، شما خودتون میتونین بیشتر در این زمینه تحقیق کنید
یا علی

... replyپاسخ


با نرم افزاری چیزی اینکارو کرده!
اگه خود طراح شخصا نشسته ساخته که بهش تبریک میگم!
آفرین بهش! 😆

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

والا چی بگم!

حسین replyپاسخ

سلام راحت میشه یه برنامه نوشت که پیکسل های عکس رو بخونه که چه رنگی هستند و تگ اون رو تولید کنه به نظرم خیلی راحت میشه این برنامه رو نوشت و هر عکسی رو به html تبدیل کرد…. 😛

add_circle ارسال دیدگاه

خوشحال میشیم دیدگاه و یا تجربیات خودتون رو با ما در میون بذارید :