HTML
- 1. The HyperText Markup Language or HTML is the standard Markup language for documents designed to be displayed in a web browser. It can be assisted by technologies such as Cascading Style Sheets. (CSS) and scripting languages such as javaScript. Web browsers receive HTML documents from a web server or from local storage and render the documents into multimedia web pages. HTML describes the structure of a web page semantically and originally included cues for the appearance of the document. HTML was created by Sir Tim Berners-Lee in late 1991 but was not officially released. It was published in 1995 as HTML 2.0. HTML 4.01 was published in late 1999 and was a major version of HTML. The idea was to create a system where researchers could create documents and share them with other researchers. The documents would be stored on a server and the researchers could access them through a web browser. Then in 1989, he composed an update proposing an Internet-based Hypertext System for global computers. Tim Berners-Lee's idea was a model in which users can navigate from one set of information on a computer to another set of information on another computer. Tim Berners-Lee wrote the browser and server software for HTML in 1990. Berners-Lee and another data system engineer collaborated in 1990 to request funding but CERN rejected the project. In late 1991 Tim Berners-Lee publicly posted the description of HTML in a document called HTML Tags. The first version of HTML had 18 elements which were mostly influenced by SGML (Standard Generalized Markup Language) except for the hyperlink. 11 of those 18 elements exist inHTML4. The basic characteristics for each element were defined in the browsers and these characteristics can be modified and enhanced using css. HTML VERSIONS HTML 1.0 HTML 1.0 or first version of HTML was a version of SGML that had ability to link different document or pages using 'href'. HTML 1.0 had 20 elements or tags, now latest version of HTML, ie HTML5 has a lot more. HTML 2.0 After HTML 1.0, the second version of HTML was released in 1994. HTML 2.0 was an expansion of HTML 1.0. HTML AND ITS HISTORY
- 2. Internet Engineering Task Force (IETF) was behind it's creation. HTML 3.2 HTML 3.2 was released In 1997. HTML 3.2 had many new features like tables, superscript, subscript etc. Two most important features introduced in HTML 3.2 were tables and text flow around images. Tables were widely used and programmers still use them but it is not recommended anymore. In HTML5 div tags and other semantic elements are used more frequently instead of table element. HTML 4.01 HTML 4.01 was released In 1999. HTML 4.01 introduced features like scripting, style sheets, better tables, better forms frames and embedding objects. HTML 4.01 was a revised version of HTML 4.0, it also included features for the disabled people to enhance their interactivity with the Global world through Internet. XHTML In 2000 XHTML was released. XHTML stands for Extensible Hyper Text Markup Language. XHTML has strict set of rules and it is basically an XML application of HTML. HTML5 So all of this added up and then after so many year HTML5 was released in 2014. HTML5 is the best version of HTML up till now. HTML5 improved user interactivity so much and also lessened the burden of devices. HTML5 fully supports all kind of media application that are there. HTML5 supports both audio and video media content. HTML5 also provides full support for JavaScript to run in the background. PLATFORMS SUPPORTED: • notepad • notepad ++ • visual studio code • visualcode • code block and many more HTML Headings HTML headings are defined with the <h1> to <h6> tags.
- 3. <h1> defines the most important heading. <h6> defines the least important + Output: HTML HEADING The HTML <p> element defines a paragraph. A paragraph always starts on a new line, and browsers automatically add some white space before and after a paragraph. CODE:
- 4. OUTPUT: HTML Comment Tag You can add comments to your HTML source by using the following syntax. <!-- Write your comments here -->
- 5. CODE: OUTPUT: HTML Links - Hyperlinks HTML links are hyperlinks. You can click on a link and jump to another document. When you move the mouse over a link, the mouse arrow will turn into a little hand. The HTML <a> tag defines a hyperlink. It has the following syntax: <a href="url">link text</a> CODE:
- 6. OUTPUT:
- 7. HTML Images Images can improve the design and the appearance of a web page. The HTML <img> tag is used to embed an image in a web page. Images are not technically inserted into a web page; images are linked to web pages. The <img> tag creates a holding space for the referenced image. The <img> tag is empty, it contains attributes only, and does not have a closing tag. The <img> tag has two required attributes: • src - Specifies the path to the image • alt - Specifies an alternate text for the image OUTPUT:
- 8. HTML Table A table in HTML consists of table cells inside rows and columns. HTML tables allow web developers to arrange data into rows and columns.Each table cell is defined by a <td> and a </td> tag. td stands for table data. Everything between <td> and </td> are the content of the table cell.Each table row starts with a <tr> and ends with a </tr> tag. tr stands for table row. HTML Table Colspan & Rowspan HTML tables can have cells that span over multiple rows and/or columns.To make a cell span over multiple columns, use the colspan attribute: To make a cell span over multiple rows, use the rowspan attribute
- 9. OUTPUT:
- 10. OUTPUT:
- 11. COLSPAN: OUTPUT:
- 12. HTML Lists Unordered HTML List An unordered list starts with the <ul> tag. Each list item starts with the <li> tag. The list items will be marked with bullets (small black circles) by default. OUTPUT:
- 13. Ordered HTML List An ordered list starts with the <ol> tag. Each list item starts with the <li> tag. The list items will be marked with numbers by default OUTPUT:
- 14. HTML Forms An HTML form is used to collect user input. The user input is most often sent to a server for processing. The HTML <form> element is used to create an HTML form for user input: <form> . form elements . </form> The <form> element is a container for different types of input elements, such as: text fields, checkboxes, radio buttons, submit buttons, etc. The <input> Element The HTML <input> element is the most used form element. An <input> element can be displayed in many ways, depending on the type attribute. Text Fields The <input type="text"> defines a single-line input field for text input.
- 15. OUTPUT: Radio Buttons The <input type="radio"> defines a radio button. Radio buttons let a user select ONE of a limited number of choices.
- 16. OUTPUT: Checkboxes The <input type="checkbox"> defines a checkbox. Checkboxes let a user select ZERO or MORE options of a limited number of choices.
- 17. OUTPUT: HTML <iframe> Tag The <iframe> tag specifies an inline frame. An inline frame is used to embed another document within the current HTML document.
- 18. output: Semantic Elements? A semantic element clearly describes its meaning to both the browser and the developer. Examples of non-semantic elements: <div> and <span> - Tells nothing about its content. Examples of semantic elements: <form>, <table>, and <article> - Clearly defines its content some of semantic tags are as follows:
- 20. output: Non-Symentc Tags: These are those tags which tells nothing about its content. examples of theseare <div> and <spam> tags.
- 21. output: HTML Block and Inline Elements Every HTML element has a default display value, depending on what type of element it is. There are two display values: block and inline. Block-level Elements A block-level element always starts on a new line, and the browsers automatically add some space (a margin) before and after the element. A block-level element always takes up the full width available (stretches out to the left and right as far as it can). Two commonly used block elements are: <p> and <div>. The <p> element defines a paragraph in an HTML document. The <div> element defines a division or a section in an HTML document.
- 22. output: here are some examples of block tags Inline Elements An inline element does not start on a new line. An inline element only takes up as much width as necessary. This is a <span> element inside a paragraph.
- 23. output: here are some inline tags. CSS(Cascading Style Sheets) CSS is the language we use to style an HTML document. CSS describes how HTML elements should be displayed. What is 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 External stylesheets are stored in CSS files There are three ways of inserting a style sheet: External CSS Internal CSS
- 25. INTERNAL CSS: An internal style sheet may be used if one single HTML page has a unique style. The internal style is defined inside the <style> element, inside the head section. output: INLINE CSS: An inline style may be used to apply a unique style for a single element. To use inline styles, add the style attribute to the relevant element. The style attribute can contain any CSS property.
- 27. CSS Backgrounds The CSS background properties are used to add background effects for elements. the following CSS background properties: • background-color • background-image • background-repeat • background-attachment • background-position • background (shorthand property)
- 28. output: