HTML5 and CSS3 Training
HTML is a markup language that forms a base for any website on the Internet.
HTML 1 was created by a CERN scientist Tim Berners-Lee. His initial goal was an Internet-based hypertext system that allows sharing and using documents in different computers. Introduced in 1991, HTML 1 only had 18 tags, most of them based on the Standard Generalized Markup Language (SGML). HTML 2 was presented in 1995 and had a few more features.
The draft of HTML 3 was abandoned due to slow implementation of the newly created tags. Therefore, the World Wide Web Consortium set out to standardize HTML. In 1997, HTML 3.2 was released which became a standard at the time.
HTML 4 was a large step, as it separated styling from coding, leaving the former to CSS. A revised version called HTML 4.01 came out in 1999, correcting minor mistakes found in HTML 4.0 and introducing a few handy features.
Addressing The Flash Problem
Better Semantic Markup
HTML5 is highly flexible and supported on all browsers
User friendly and an open technology.
CSS handles the look and feel part of a web page. Using CSS, you can control the color of the text, the style of fonts, the spacing between paragraphs, how columns are sized and laid out, what background images or colors are used, layout designs,variations in display for different devices and screen sizes as well as a variety of other effects.
In simple words, CSS is the technology that allows us to create beautiful, maintainable and flexible designs. It controls formatting, presentation and the overall layout of websites. A main reason we use CSS isn’t only to create flexible, maintainable website designs, but also to keep content separate from presentation, which is a best practice. It’s also much easier for human eyes to read what’s happening in the HTML if there aren’t styles thrown in too.
CSS3 is the latest evolution of the Cascading Style Sheets language and aims at extending CSS2. 1. It brings a lot of long-awaited novelties, like rounded corners, shadows, gradients, transitions or animations, as well as new layouts like multi-columns, flexible box or grid layouts.
Benefits of CSS
Pages load faster − If you are using CSS, you do not need to write HTML tag attributes every time. Just write one CSS rule of a tag and apply it to all the occurrences of that tag. So less code means faster download times.
Easy maintenance − To make a global change, simply change the style, and all elements in all the web pages will be updated automatically.
Multiple Device Compatibility − Style sheets allow content to be optimized for more than one type of device. By using the same HTML document, different versions of a website can be presented for handheld devices such as PDAs and cell phones or for printing.
Global web standards − Now HTML attributes are being deprecated and it is being recommended to use CSS. So its a good idea to start using CSS in all the HTML pages to make them compatible to future browsers.
History of HTML
What you need to do to get going and make your first HTML page
What are HTML Tags and Attributes?
HTML Tag vs. Element
How to differentiate HTML Document Versions
HTML – Basic Formatting Tag
HTML – Grouping Using Div Span
Div and Span Tags for Grouping
HTML – Lists
element: an ordered list (
- ), an unordered list (
- ), or a menu (
HTML – Images
Creating an image
Choosing alt text
Responsive image using the srcset attribute
Responsive image using picture element
HTML – Hyperlink & Anchors
Link to another site
Link to an anchor link to a page on the same site Link that dials a number
Open link in new tab/window
HTML – Tables
Spanning columns or rows
Table with thead, tbody, tfoot
HTML – iframe
iframe as the Target
HTML – Forms
Target attribute in form tag
Grouping a few input ﬁelds
HTML – Headers
The HTMLelement provides general information (metadata) about the document,
including its title and links to its scripts and style sheets.
HTML – Miscellaneous
meta-related elements, like