PROFILE CARD HTML

-

 <!DOCTYPE html>

<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Profile card</title>

        <!-- Boxicons here !! -->
        <link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css'
            rel='stylesheet'>
        <link rel="preconnect" href="https://fonts.googleapis.com">

        <!-- google fonts -->
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link
            href="https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
            rel="stylesheet">
        <!-- Link css like this -->
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <div class="profile-card">
            <div class="image">
                <div class="profile-img">
                    <img src="pf.png" alt>
                </div>
                <div class="text-data">
                    <span class="name">Priyanshu Ben</span>
                    <span class="role">IGL + Sniper</span>
                </div>
            </div>
        </div>

    </body>
</html>

Comments

Post a Comment

Popular posts from this blog

HTML FORMS

-
  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < title > Document </ title > </ head > < body >     < H1 > Forms in HTML </ H1 >     < form action = "/submit.php" > < div >   < label for = "Name" > Name </ label >   < input type = "text" placeholder = "Enter name" > </ div > < div >     < label for = "Phone" > Phone </ label >     < input type = "tel" placeholder = "Enter phone no." >     </ div >     < div >     < label for = "Email" > Email </ label >     < input type = "email" placeholder = "Email" >     </ div >     < div >     < l...
Read more

FORM STYLING IN CSS

-
<! DOCTYPE html > < html lang = "en" >   < head >     < meta charset = "UTF-8" />     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" />     < title > forms </ title >   </ head >   < style >     body {       margin : 0 ;       padding : 0 ;     }     .csf {       display : flexbox;       text-align : center ;       background-color : rgb ( 216 , 216 , 216 );       height : 400px ;       width : 550px ;       padding : 90px 0px 0px 15px ;       margin-left : 40% ;       margin-top : 10% ;       border-radius : 2px ;       border : 2px solid ;       font-size : 19px ;     }     input {       mar...
Read more