HTML LayoutsHTML layouts provide a way to arrange web pages in well-mannered, well-structured, and in responsive form or we can say that HTML layout specifies a way in which the web pages can be arranged. Web-page layout works with arrangement of visual elements of an HTML document. Web page layout is the most important part to keep in mind while creating a website so that our website can appear professional with the great look. You can also use CSS and JAVASCRIPT based frameworks for creating layouts for responsive and dynamic website designing. ![]() Every website has a specific layout to display content in a specific manner. Following are different HTML5 elements which are used to define the different parts of a webpage.
NOTE: HTML layouts create an individual space for every part of the web page. So that every element can arrange in a significant order.Description of various Layout elementsHTML <header>The <header> element is used to create header section of web pages. The header contains the introductory content, heading element, logo or icon for the webpage, and authorship information. Example:Test it NowHTML <nav>The <nav> elements is a container for the main block of navigation links. It can contain links for the same page or for other pages. Example:Test it NowHTML <section>HTML <section> elements represent a separate section of a web page which contains related element grouped together. It can contain: text, images, tables, videos, etc. Example:Test it NowHTML <article>The HTML Example:Test it NowHTML <aside>HTML <aside> define aside content related to primary content. The <aside> content must be related to the primary content. It can function as side bar for the main content of web page. Example:Test it NowHTML <footer>HTML <footer> element defines the footer for that document or web page. It mostly contains information about author, copyright, other links, etc. Example:Test it NowHTML <details>HTML <details> element is used to add extra details about the web page and use can hide or show the details as per requirement. Example:Test it NowHTML <summary>HTML <summary> element is used with the <details> element in a web page. It is used as summary, captions about the content of <details> element. Example:Test it Now
Next TopicHTML Layout Techniques
|