20 روش برتر CSS3 و HTML که باید بدانید

عکس پروفایل Astrit Hacker Noon

@استریتآستریت

Front-end Developer ، سازنده CSS.GG

سلام

مدتی است که برخی از پیشرفته ترین ویژگی های CSS موجود در آن مانند Houdini APIpropert و همچنین عجیب ترین کارهایی را که می توانید با موقعیت چسبناک انجام دهید و همه آن ها را در یک ویدیوی طولانی 2 ساعت جمع آوری کرده اید ، در یک مکان واحد جمع آوری کرده ام.

جایی که من بهترین روش ها را برای دستیابی به تأثیری که در این صفحه فرود مانند حالت mix-blend-mode ، clip-path ، موقعیت: sticky ، css و سایر موارد مشاهده می کنید ، مرور می کنم.

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

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

بدون اینکه بیشتر به آنچه در آنجا گنجانده شده است بپردازم ، شما را به تماشای فیلم دعوت می کنم

https://www.youtube.com/watch؟v=PpheLuPbP5Y

اگر می خواهید با آن بازی کنید ، ادامه دهید و منبع و نسخه ی نمایشی را در زیر بررسی کنید

منبع: https://github.com/astrit/youtube

نسخه ی نمایشی: https://css.gg/epic/index.html

همچنین در https://dev.to/astrit/full-page-20-ad Advanced-css-html-techniques-clip-path-property-aspect-ratio-and-blend-mode-1ee7