Wednesday, September 28, 2022

Background Image

<!DOCTYPE html>
<html>
    <head>
        <title> Background Image </title>
        <style type="text/css">
            body {
            background-image:url("images/background1.jpg");
            margin:80px 80px 100px 100px;
            background-repeat: no-repeat;
            background-attachment: fixed; 
            background-size: 200% 100%;
            background-blend-mode: lighten;
            }

            div#fixedheader{
            position:fixed;
            top:0px;
            left:0px;
            width:100%;
            height:10%;
            color:#CCC;
            background-image:url("images/background.jpg");
            background-repeat: no-repeat;
            background-attachment: fixed; 
            background-size: 200% 50%;
            padding:20px;
            }
            
            div#fixedfooter{
            bottom:0px;
            left:0px;
            width:100%;
            height:10%;
            background-image:url("images/background.jpg");
            background-repeat: no-repeat;
            background-attachment: fixed; 
            background-size: 150% 100%;
            color:#CCC;
            padding:20px;
            }
            
            </style>
    </head>
    <body>

        <div id="fixedheader" ><h1> About Kriztia Fariñas </h1></div>
        <h1> Name: Kriztia G. Fariñas </h1>
        <h1> My Favorite Songs </h1>
        <ol>
            <li> Coldplay - Sparks </li>
            <li> Cuco - Fin Del Munndo </li>
            <li> Harry Styles - Satellite </li>
            <li> Hayley Williams - Why We Ever</li>
        </ol>
        <h1> My Favorite Subjects </h1>
        <ul>
            <li> 3D Modelling </li>
            <li> Multimedia Education </li>
            <li> Web Programming </li>
            <li> Multimedia Publishing </li>
        </ul>
        <h1> Links </h1>
        <p> <a href="https://www.facebook.com/cr3.se"> Faceboook </a></p>
        <p> <a href="https://kriztiafarinas-mma.blogspot.com/"> Portfolio </a></p>
        <p> The content of my portfolio consists of different activities and artworks in college. </p>
        <p> <a href="https://www.instagram.com/8zirk/"> Instagram </a></p>
        <div id="fixedfooter">Thank you for reading!</div>
    
    </body>
</html>

Photo Gallery

<!DOCTYPE html>
<html>
    <head>
        <title> My Art Photo Gallery </title>

        <style>
        img
            {
                width: 200px;
                height: 190px;
            }

        th
            {
                font-size: 2em;
                background-color: #6e7f67 ;
                padding: 20px;
            }
        
        body
            {
                font-family: sans-serif;
                font-size: 1em;
                text-align: center;
                background-color: #c0cdba ; 
            }

        table
            {
                background-color: white;
                width: 60%;
            }

        td
            {
                padding: 25px;
            }



        </style>
    </head>

<body>
    <table align="center">
        <tr>
            <th colspan="4"> Kriztia's Art Gallery </th>
        </tr>

        <tr>
            <td colspan="4"> These are some of the art that I made this year. </td>
        </tr>

        <tr>
            <td><img src="images/bjbjb.png"></td>
            <td><img src="images/bust.png"></td>
            <td><img src="images/bust1.png"></td>
            <td><img src="images/jini.png"></td>
        </tr>

        <tr>
            <td><img src="images/eye.png"></td>
            <td><img src="images/prac3.png"></td>
            <td><img src="images/redraw.png"></td>
            <td><img src="images/pet.png"></td>
        </tr>
    </table>
</body>
</html>