Skip to content
 
 

Latest commit

 

History

3 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 

Repository files navigation

Ex.06 Book Front Cover Page Design

Date:23.09.2025

AIM:

To design a book front cover page using HTML and CSS.

DESIGN STEPS:

Step 1:

Create a Django Admin project.

Step 2:

Create an app in the Django interface.

Step 3:

Create a folder named 'static' in the app folder.

Step 4:

Create a new HTML file in the static folder.

Step 5:

Write the HTML code with relevant CSS properties.

Step 6:

Choose the appropriate style and color scheme.

Step 7:

Insert the images in their appropriate places.

Step 8:

Publish the website in the LocalHost.

PROGRAM:

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Book Cover</title>
    <style>
    body {
        margin: 0;
        padding: 0;
        background: white ;
        font-family: 'Georgia', serif;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
    }

    .book-cover {
        width: 300px;
        height: 450px;
        background: linear-gradient(to bottom right, #2c3e50, #3498db);
        color: white;
        padding: 20px;
        box-shadow: 0 10px 20px rgba(0,0,0,0.3);
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        border-radius: 10px;
    }
    .book-title {
            font-size: 28px;
            font-weight: bold;
            margin-top: 20px;
    }

    .book-author {
        font-size: 18px;
        font-style: italic;
        margin-bottom: 20px;
        text-align: right;
    }

    .book-footer {
        font-size: 14px;
        text-align: center;
        opacity: 0.8;
    }

</style>
    </head>
<body>
<div class="book-cover">
    <div class="book-title">The Secret Garden</div>
    <div>
    <img src="https://manhassetlibrary.org/site/wp-content/uploads/FHB-collection2.jpg" style="float:right" alt="book-cover" width="200 px" height="200 px" >
    </div>
    <div class="book-author">by Frances Hodgson Burnett</div>
    <div class="book-footer">Published 1911</div>
</div>
</body>
</html>


OUTPUT:

alt text

RESULT:

The program for designing book front cover page using HTML and CSS is completed successfully.

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages