MY-NOTES: websites
Showing posts with label websites. Show all posts
Showing posts with label websites. Show all posts

Sunday, December 20, 2020

Best OUR teams responsive cards

December 20, 2020 0
Best OUR teams responsive cards
 Best OUR teams responsive cardsHTML code of this responsive our teams card :<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>Out-teams-designs</title>    <link rel="stylesheet" href="style.css">    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">   </head><body>    <section>        <div class="container slider">            <div class="card">                <div class="content">                    <div class="imgBx"><img src="Images/tmemb1.jpg" alt=""></div>                    <div class="contentBx">                        <h3>Someone Famous <br> <span>creative designer</span></h3>                    </div>                </div>                <ul class="sci">                    <li style="--i:1">                        <a href="#"><i class="fa fa-facebook"></i></a>                    </li>                    <li style="--i:2">                        <a href="#"><i class="fa fa-instagram"></i></a>                    </li>                    <li style="--i:3">                        <a href="#"><i class="fa fa-twitter"></i></a>                    </li>                </ul>            </div>            <div class="card">                <div class="content">                    <div class="imgBx"><img src="Images/tmemb2.jpg" alt=""></div>                    <div class="contentBx">                        <h3>Someone Famous <br> <span>creative designer</span></h3>                    </div>                </div>                <ul class="sci">                    <li style="--i:1">                        <a href="#"><i class="fa fa-facebook"></i></a>                    </li>                    <li style="--i:2">                        <a href="#"><i class="fa fa-instagram"></i></a>                    </li>                    <li style="--i:3">                        <a href="#"><i class="fa fa-twitter"></i></a>                    </li>                </ul>            </div>            <div class="card">                <div class="content">                    <div class="imgBx"><img src="Images/tmemb3.jpg" alt=""></div>                    <div class="contentBx">                        <h3>Someone Famous <br> <span>creative designer</span></h3>                    </div>                </div>                <ul class="sci">                    <li style="--i:1">                        <a href="#"><i class="fa fa-facebook"></i></a>                    </li>                    <li style="--i:2">                        <a href="#"><i class="fa fa-instagram"></i></a>                    </li>                    <li style="--i:3">                        <a href="#"><i class="fa fa-twitter"></i></a>                    </li>                </ul>            </div>        </div>    </section></body></html>CSS...

Beautiful Responsive Cards

December 20, 2020 0
Beautiful Responsive Cards
RESPONSIVE CARDS These are awesome and responsive cards .HTML code:<!DOCTYPE html><html><head><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"><link rel="stylesheet" href="style.css"></head><body><div class="row">  <div class="column">    <div class="card">      <img src="1.jpg" style="width:150px;height:auto;padding-top:10px">      <h1>Json watson</h1>      <p class="title">CEO & Founder</p>      <p>Oxford university</p>      <a href="#"><i class="fa fa-instagram"></i></a>      <a href="#"><i class="fa fa-twitter"></i></a>      <a href="#"><i class="fa fa-dribbble"></i></a>      <a href="#"><i class="fa fa-facebook"></i></a>      <p><button>Contact</button></p>    </div>  </div>  <div class="column">    <div class="card">      <img src="3.jpg" style="width:150px;height:auto;padding-top:10px">      <h1>Jon watson</h1>      <p class="title">CEO & Founder</p>      <p>Oxford university</p>      <a href="#"><i class="fa fa-instagram"></i></a>      <a href="#"><i class="fa fa-twitter"></i></a>      <a href="#"><i class="fa fa-dribbble"></i></a>      <a href="#"><i class="fa fa-facebook"></i></a>      <p><button>Contact</button></p>    </div>  </div>  <div class="column">    <div class="card">      <img src="2.png" style="width:150px;height:auto;padding-top:10px">      <h1>Nick watson</h1>      <p class="title">CEO & Founder</p>      <p>Oxford university</p>      <a href="#"><i class="fa fa-instagram"></i></a>      <a href="#"><i class="fa fa-twitter"></i></a>      <a href="#"><i class="fa fa-dribbble"></i></a>      <a href="#"><i class="fa fa-facebook"></i></a>      <p><button>Contact</button></p>    </div>  </div>  <div class="column">    <div class="card">      <img src="4.png" style="width:150px;height:auto;padding-top:10px">      <h1>Joy watson</h1>      <p class="title">CEO & Founder</p>      <p>Oxford university</p>      <a href="#"><i class="fa fa-instagram"></i></a>      <a href="#"><i class="fa fa-twitter"></i></a>      <a href="#"><i class="fa fa-dribbble"></i></a>      <a href="#"><i class="fa fa-facebook"></i></a>      <p><button>Contact</button></p>    </div>  </div></div></body></html>And...