Visit: https://a2zcareers.viden.io
Knowledge in HTML5
HTML Elements
HTML Elements An HTML element usually consists of a start tag and an end tag, with the content inserted in between: Content goes here... The HTML element is everything from the start tag to the end tag: My first paragraph.
yash sharma
HTML Paragraphs
HTML Paragraphs The HTML element defines a paragraph: Example This is a paragraph. This is another paragraph. » Note: Browsers automatically add some white space (a margin) before and after a paragraph. ________________________________________ HTML Display You cannot be sure how HTML will be displayed. Large or small screens, and resized windows will create different results. With HTML, you cannot change the output by adding extra spaces or extra lines in your HTML code. The browser will remove any extra spaces and extra lines when the page is displayed: Example This paragraph contains a lot of lines in the source code, but the browser ignores it. This paragraph contains a lot of spaces in the source code, but the browser ignores it. »
HTML Basic
HTML Basic Examples Don't worry if these examples use tags you have not learned. You will learn about them in the next chapters. ________________________________________ HTML Documents All HTML documents must start with a document type declaration: . The HTML document itself begins with and ends with . The visible part of the HTML document is between and . Example My First Heading My first paragraph.
HTML Background Images
Background Images A background image can be specified on almost any HTML element. To add a background image in HTML, use the CSS property background-image. ________________________________________ Background Image on a HTML element To add a background image on an HTML element, you can use the style attribute: Example Add a background image on a HTML element: Try it Yourself » You can also specify the background image in the element: Example Specify the background image in the style element: div { background-image: url('img_girl.jpg');
HTML The class Attribute
Using The class Attribute The HTML class attribute is used to define equal styles for elements with the same class name. So, all HTML elements with the same class attribute will get the same style. Here we have three elements that point to the same class name: Example .cities { background-color: black; color: white; margin: 20px; padding: 20px; } London London is the capital of England. Paris Paris is the capital of France. Tokyo Tokyo is the capital of Japan.
HTML Comments
HTML Comments Comment tags are used to insert comments in the HTML source code. ________________________________________ HTML Comment Tags You can add comments to your HTML source by using the following syntax: Notice that there is an exclamation point (!) in the opening tag, but not in the closing tag. Note: Comments are not displayed by the browser, but they can help document your HTML source code. With comments you can place notifications and reminders in your HTML: Example This is a paragraph. Comments are also great for debugging HTML, because you can comment out HTML lines of code, one at a time, to search for errors: Example
HTML Styles
HTML Styles HTML Styles - CSS CSS = Styles and Colors Manipulate Text Colors, Boxes ________________________________________ Styling HTML with CSS CSS stands for Cascading Style Sheets. CSS describes how HTML elements are to be displayed on screen, paper, or in other media. CSS saves a lot of work. It can control the layout of multiple web pages all at once. CSS can be added to HTML elements in 3 ways: • Inline - by using the style attribute in HTML elements • Internal - by using a element in the section • External - by using an external CSS file The most common way to add CSS, is to keep the styles in separate CSS files. However, here we will use inline and internal styling, because this is easier to demonstrate, and easier for you to try it yourself. Tip: You can learn much more about CSS in our CSS Tutorial. ________________________________________ Inline CSS An inline CSS is used to apply a unique style to a single HTML element. An inline CSS uses the style attribute of an HTML element. This example sets the text color of the element to blue:
HTML Editors
HTML Editors Write HTML Using Notepad or TextEdit Web pages can be created and modified by using professional HTML editors. However, for learning HTML we recommend a simple text editor like Notepad (PC) or TextEdit (Mac). We believe using a simple text editor is a good way to learn HTML. Follow the steps below to create your first web page with Notepad or TextEdit. ________________________________________ Step 1: Open Notepad (PC) Windows 8 or later: Open the Start Screen (the window symbol at the bottom left on your screen). Type Notepad. Windows 7 or earlier: Open Start > Programs > Accessories > Notepad ________________________________________ Step 1: Open TextEdit (Mac) Open Finder > Applications > TextEdit Also change some preferences to get the application to save files correctly. In Preferences > Format > choose "Plain Text" Then under "Open and Save", check the box that says "Display HTML files as HTML code instead of formatted text". Then open a new document to place the code. ________________________________________
HTML File Paths
HTML File Paths A file path describes the location of a file in a web site's folder structure. File paths are used when linking to external files like: • Web pages • Images • Style sheets • JavaScripts ________________________________________ Absolute File Paths An absolute file path is the full URL to an internet file: Example Try it Yourself » The tag is explained in the chapter about HTML Images. ________________________________________ Relative File Paths A relative file path points to a file relative to the current page. In this example, the file path points to a file in the images folder located at the root of the current web: Example Try it Yourself » In this example, the file path points to a file in the images folder located in the current folder: Example
HTML Head
HTML Head The HTML Element The element is a container for metadata (data about data) and is placed between the tag and the tag. HTML metadata is data about the HTML document. Metadata is not displayed. Metadata typically define the document title, character set, styles, scripts, and other meta information. The following tags describe metadata: , , , , , and .
HTML Introduction
What is HTML? HTML is the standard markup language for creating Web pages. • HTML stands for Hyper Text Markup Language • HTML describes the structure of a Web page • HTML consists of a series of elements • HTML elements tell the browser how to display the content • HTML elements are represented by tags • HTML tags label pieces of content such as "heading", "paragraph", "table", and so on • Browsers do not display the HTML tags, but use them to render the content of the page Example Explained • The declaration defines this document to be HTML5 • The element is the root element of an HTML page • The element contains meta information about the document • The element specifies a title for the document • The element contains the visible page content • The element defines a large heading • The element defines a paragraph
HTML Lists
HTML List Example An Unordered List: • Item • Item • Item • Item An Ordered List: 1. First item 2. Second item 3. Third item 4. Fourth item Unordered HTML List An unordered list starts with the tag. Each list item starts with the tag. The list items will be marked with bullets (small black circles) by default: Example Coffee Tea Milk Try it Yourself »