card html design code example

Example 1: html make card

box-shadow: 0 20px 20px rgba(0, 0, 0, 0.2), 0px, 0px, 50px rgba(0, 0, 0, 0.2)

Example 2: cards design html css

<div class="card">
  <img src="img_avatar.png" alt="Avatar" style="width:100%">
  <div class="container">
    <h4><b>sam</b></h4>
    <p>https://codewithsam-53039.web.app/</p>
  </div>
</div>

Example 3: CARD WITH IMAGE CSS

<div class="card">
    <div class="card-content">
      <p>I am a very simple card. I am good at containing small bits of information. I am convenient because I require little markup to use effectively.</p>
    </div>
    <div class="card-tabs">
      <ul class="tabs tabs-fixed-width">
        <li class="tab"><a href="https://amzn.to/3jOaZKL">Test 1</a></li>
        <li class="tab"><a class="active" href="#test5">Test 2</a></li>
        <li class="tab"><a href="#test6">Test 3</a></li>
      </ul>
    </div>
    <div class="card-content grey lighten-4">
      <div id="test4">Test 1</div>
      <div id="test5">Test 2</div>
      <div id="test6">Test 3</div>
    </div>
  </div>

Tags:

Css Example