نمایش یک عکس به صورت کارت (Card)، با کلاس های مربوط به ساخت کارت (کلاس های w3-card و w3-card-2 و w3-card-4)، در W3.CSS
چنانچه قصد داشته باشیم که یک عکس به صورت کارت (Card) نمایش داده شود، تنها کافی است که یکی از کلاسهای (Class) مربوط به ساخت کارت (Card) در چارچوب W3.CSS ، یعنی یکی از کلاس های w3-card و w3-card-2 و w3-card-4 را برای تگ div حاوی تگ img مربوط به آن عکس ذکر نماییم (تگ img برای نمایش عکس به کار می رود - کلید شماره 507 ).
ویژگی کارت (card) این است که با داشتن حاشیه سایه دار (bordered shadow)، شبیه به یک کارت (card) کاغذی خواهد بود و نسبت به سایر بخش های صفحه، کمی برجسته به نظر می آید.
به عنوان مثال، کد زیر را می نویسیم :
به مثال زیر توجه کنید :
بخش مهم کدها :
کد کامل صفحه HTML :
نتیجه :
یک مثال از وب سایت w3schools.com :
بخش مهم کدها :
کد کامل صفحه HTML :