Scribd Logo
Upload

Welcome to Scribd!

  • Task Css

    Uploaded by

    Aim More
    13 views4 pages
    The document contains CSS code that defines styles for different elements on a web page. There are styles defined for boxes used to contain business information, user profiles, images, and buttons. The CSS code specifies properties for these elements like background color, font, size, padding, and borders. The HTML code then uses these styles to display content on the page including business descriptions, user profile images, a photo gallery, and a login form.

    Original Description:

    Another css project with code

    Original Title

    task css

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The document contains CSS code that defines styles for different elements on a web page. There are styles defined for boxes used to contain business information, user profiles, images, and buttons. The CSS code specifies properties for these elements like background color, font, size, padding, and borders. The HTML code then uses these styles to display content on the page including business descriptions, user profile images, a photo gallery, and a login form.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    13 views4 pages

    Task Css

    Uploaded by

    Aim More
    The document contains CSS code that defines styles for different elements on a web page. There are styles defined for boxes used to contain business information, user profiles, images, and buttons. The CSS code specifies properties for these elements like background color, font, size, padding, and borders. The HTML code then uses these styles to display content on the page including business descriptions, user profile images, a photo gallery, and a login form.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    of 4

    styles.

    css code

    .box-business{
    background-color:rgb(81, 102, 102);
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
    Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    width:300;
    border:2px solid lightgrey;
    border-radius: 20px;
    padding :90px;
    margin:90 px auto;

    }
    .box-btn{
    background-color: #000000;
    color: #FFFFFF;
    padding:5px;
    border:none;
    border-radius: 25px;

    }
    .box-profile{
    background-color:white;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
    Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    width:300;
    border:2px solid lightgrey;
    border-radius: 20px;
    padding :10px;

    margin :50px auto;


    }
    .box-img{

    border:none;
    width:100%;

    padding:16px 30px;
    }
    .box-btn1{
    background-color: white;
    color:rgb(25, 25, 209);
    padding:5px;
    border:none;

    Assignment1.html code

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <title>welcome</title>
    <link rel="stylesheet" href="styles.css">
    </head>
    <body>
    <div class="box-business" >
    <p style="font-weight:bolder; font-size:42pt;">
    Business</br>
    Development</p>
    <p >Have an idea or inquiry for Waze business development?
    </p>
    <button class="box-btn" style="font-size:14pt; width:250px; height:40px;
    padding:5px;">Share your ideas</button>

    </div>
    <div class="box-profile" >
    <p style="font-weight:bolder; font-size:42pt;">
    Your Profiles
    </p>
    <p style=" font-size:14pt; color:grey;">
    See how your different profiles appear in Google services</p>
    <img
    src="https://i.pinimg.com/474x/4d/48/3b/4d483b849789255762cc0d9c8617fd3c.jpg "
    class="box-img;" style="width:40%; border-radius: 150px;" >
    <img
    src="https://i.pinimg.com/474x/f2/7b/eb/f27beb81c40dd9666b3478aa17dbda1a.jpg"
    class="box-img;" style="width:40%; border-radius:650px;">
    </div>
    <div class="box-profile" >
    <img src="https://wallpapercave.com/wp/wp4992925.jpg" class="box-img;"
    style="width:100%;" >

    <p style=" font-size:14pt; color:grey;">


    Subscribe to any Plan
    </p>
    <p style="font-weight:bolder; font-size:42pt;">
    Get more features in Google photos
    </p>
    <p style=" font-size:14pt; color:grey;">
    Bring your favourite moments to life with more Google Photos editing
    tools for Android and iOs ,including Magic Eraser.Subject to eligibility.
    </p>
    <button class="box-btn1" style="font-size:14pt; width:250px;
    height:40px; padding:5px; border-radius: 5px;">View details</button>

    </div>
    <form class="">
    <center>
    </br>
    </br>
    <font color="black">
    <h1><b> FLODESK </b></h1>
    <h3><b> Welcome back!</b></h3>
    </br>
    <div><h3> Enter your email : <input type="text"></h3></div>
    <div><h3> Enter your Password : <input type="password"></h3></div>
    <button>Log in to Flodesk</button>
    <div><h4>Not a member</h4></div>
    <a href="signup.html">signup</a>

    </font>
    </center>
    </body>
    </html>

    You might also like