Scribd Logo
Importer

Bienvenue sur Scribd !

  • HTML Code For Home Page

    Transféré par

    Utkarsh Yadav
    3 vues9 pages
    this id the html code to make a beautiful home page for ur website

    Titre original

    HTML CODE FOR HOME PAGE

    Copyright

    © © All Rights Reserved

    Formats disponibles

    DOCX, PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Signaler ce document
    this id the html code to make a beautiful home page for ur website

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme DOCX, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    3 vues9 pages

    HTML Code For Home Page

    Transféré par

    Utkarsh Yadav
    this id the html code to make a beautiful home page for ur website

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme DOCX, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    sur 9

    ############# HTML CODE FOR HOME PAGE ###############

    {% load static %}

    <!DOCTYPE html>

    <html>

    <head>

    <title></title>

    </head>

    <body>

    <link rel="stylesheet" href={%static "css\home_style.css" %}>

    <div id="header">

    <img src={%static "css/logo.jpg" %}>


    <h1>KISANSEVA:</h1><h4>Ready to help</h4>

    </div>

    <script type="text/javascript">

    function toggleslidebar(){

    document.getElementById('sidebar').classList.toggle('active');

    </script>

    <div id="sidebar">

    <div class="toggle_button" onclick="toggleslidebar()">

    <span></span>

    <span></span>

    <span></span>

    </div>
    <ul>

    <li><a href="http://localhost:8000/home/">Home</a></li>

    <li><a href="http://localhost:8000/home/complaint/">Complaint
    Forum</a></li>

    <li><a href="http://localhost:8000/home/soiltypes/">Soil Types in


    India</a></li>

    <li><a href="http://localhost:8000/home/prices/">Daily Prices</a></li>

    <li><a href="http://localhost:8000/home/gallary/">Gallery</a></li>

    <li><a href="#">contact</a></li>

    <li><a href="#">about</a></li>

    </ul>

    </div>

    <br><br><br><br><br><br>

    <div id="content">

    <img src={%static "css/ag.jpeg" %}>

    <br>

    We're glad that you are here on this page.You are at the right place if you are looking
    for help in any topic about agriculture.<p>

    We are totally devoted to help you about agricultuaral methods and different
    practices.<p>

    Here you can know about different types of agricultural methods<p>

    and information about agricultural devices and equipments.<p>

    You can also ask your queries with our agricultural experts
    in query section.We will<p> respond to you in no time as our team is very supportive and
    always ready to help. </div>
    <div id="submenu">

    <pre> <h3>Notifications</h3></pre>

    <br>

    <br>

    <marquee direction="up">

    <ul>

    <li>first topic</li><br>

    <li>second topic</li><br>

    <li>third topic</li><br>

    <li> first notification</li><br>

    <li>second notification</li><br>

    <li>third notification</li><br>

    </ul></marquee>

    </div>

    </body>

    </html>

    @@@@@@@@@@CSS FILE FOR HOME PAGE@@@@@@@@@@@


    *{ margin: 0px;

    padding: 4px;

    font-family: sans-serif;

    }
    #header{

    background-color: rgba(30,50,60,0.3);

    background-size:all;

    height: 100px;

    position: fixed;

    width:100%;

    #header img{

    position: absolute;

    top: 0px;

    left: 0px;

    bottom: 0px;

    right:1200px;

    margin: auto;

    width: 100px;

    height: 100px;

    #header h1{

    padding-left:250px;

    font-family: cursive;

    #header h4{

    padding-left: 400px;}
    #sidebar{

    position: fixed;

    width: 200px;

    height: 100%;

    background: #151719;

    left: -200px;

    transition: all 500ms linear;

    #sidebar.active{

    left: 0px;

    background: lightskyblue;

    #sidebar ul li{

    color:rgba(230,230,230,0.9);

    list-style: none;

    padding: 15px 10px;

    border-bottom: 1px solid rgba(100,100,100,0.3)

    #sidebar ul li a{

    text-decoration: none;

    #sidebar .toggle_button{

    position: absolute;
    left: 230px;

    top: 20px;

    #sidebar .toggle_button span{

    display: block;

    width: 30px;

    height: 0.1px;

    background:black;

    margin: 3px 0px;

    #submenu{

    float: right;

    width: 200px;

    border-style: groove;

    height: 500px;

    border-top-width: 15%;

    border-radius: 15px;

    #submenu h3{

    background-color: lightskyblue;

    #submenu li{

    font-family: elephant;}
    #navbar li{

    list-style-type: none;

    text-align: center;

    float: left;

    height: 40px;

    width: 150px;

    #navbar li a{

    text-decoration: none;

    background-color:rgba(40,50,40,0.5);

    display: block;

    color: black;

    height: 40px;

    width: 150px;

    line-height: 42px;

    transition: 0.5s;

    ul.items,

    ul.sub-items{

    position: relative;

    display: none;

    ul.items{
    right: 40px;

    ul.sub-items{

    left: 110px;

    bottom: 41px;

    ul > li:hover > ul{

    display: block;

    #navbar > li{

    margin-right: 1px;

    ul.items li{

    border-top: 1px solid white;

    ul.sub-items{

    border-left: 1px solid white;

    ul > li:hover > a{

    background: silver;

    #navbar{

    float: left;
    padding-left: 600px;

    #content{

    float: left;

    padding-left: 200px;

    Vous aimerez peut-être aussi