Rare
  • Introduction
  • HTML
    • Introduction
    • Html Structure
      • Header
      • Left Side Menu
      • Main Content
    • Main Content
      • Buttons
      • Fonts
      • Lock Screens
      • Maps
      • Modals
      • Plugins Used
      • Progress Bars
    • Css Files
    • Java Script Used
    • Scss
    • Fonts Used
    • Images used
    • Starts New page
      • Centered Logo
      • Compact Menu
      • Default
      • Horizontal
      • Light Side Bar
      • Mmenu
  • Rare Builder
    • Layouts
      • Default
      • Centered Logo
      • Compact Menu
      • Fixed Menu
      • Fixed Header
      • Horizontal
      • Icon Horizontal
      • Dark
      • Full Width
      • Header Style
      • Fixed Footer
      • Mmenu
      • Light Sidebar
    • Macros
      • Layouts
      • Breadcrumb
    • Partials
      • Headers
        • Header
        • Centered Logo Header
      • Heads
        • Head
      • Breadcrumbs
        • Breadcrumb 1
        • Breadcrumb 2
        • Breadcrumb 3
        • Breadcrumb 4
        • Breadcrumb 5
        • Breadcrumb Default
      • Ends
        • End
      • Menus
        • Default
        • Horizontal
        • Icon Horizontal
        • Compact
        • Mmenu
      • Footer
        • Footer
        • Fixed Footer
      • Messages
      • Notifications
      • User Profile
    • Add Builder
    • Commands
    • New Page
  • FAQ
    • Change Left Menu Content
    • Setting Layout As Default
    • Change Breadcrumb
    • Change Colors In scss
Powered by GitBook
On this page

Was this helpful?

  1. HTML
  2. Html Structure

Main Content

The Main Content has the following structure :

<body>

<!-- Start header-->

 <header class="header">
        <nav class="navbar navbar-static-top">
            <a href="index.html" class="logo navbar-brand float-left text-white text-center">
                <!--It contains logo--> 
            </a>
            <div class="navbar-btn float-left sidebar-toggle">
                    <div>
                        <div class="bar1 first"></div>
                        <div class="bar2 second"></div>
                        <div class="bar3 third"></div>
                    </div>
             </div>
              <div class="top_right_nav">
                    <div class="float-left">
                        <!--It contains Header Left side sections--> 
                    </div>
              </div>        
        </nav>
 </header>

<!--End header-->

<!--Start wrapper-->

    <div class="wrapper">

        <!-- Start Left side menu -->
        <div class="left_aside">

            <!-- sidebar: style can be found in sidebar-->
            <div class="sidebar">

                <!--user profile section-->
                    <div class="user_section">
                        <!--user profile content-->
                    </div>
               <!--user profile section-->


               <!--Start Left menu links-->

                    <div id="menu" role="navigation">
                        <ul class="navigation"> 

                        </ul>
                    </div> 

             <!--End Left menu links-->

            </div>
            <!-- sidebar: style can be found in sidebar-->
        </div>
       <!-- End of Left side menu -->

       <!-- Start of right Content -->

        <div class="right-aside view-port-height">

               <!--Start of Content Header (Page header) -->

               <div class="content-header container-fluid bg-white">
                     <!-- It contains page Header -->
                </div>

              <!--End of Content Header (Page header) -->


               <!--Start of Main content -->

                <div class="content">

                     <!--page content --!>

                </div>
               <!-- End of Main content --!>

         </div>

       <!-- Start of right Content -->

     </div> 

<!--Start wrapper-->


</body>
PreviousLeft Side MenuNextMain Content

Last updated 5 years ago

Was this helpful?