Getting started with Web Development: More on HTML
HTML is a wide and easy to learn language. If you have learnt the basics of html then, there are many more things that you need to know in HTML. Let, us have a look on those things.
HTML are the building blocks of HTML pages. With HTML constructs, images and other objects such as interactive forms may be embedded into the rendered page. HTML provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items. HTML elements are delineated by tags, written using angle brackets. Tags such as <img /> and <input /> directly introduce content into the page. Other tags such as <p> surround and provide information about document text and may include other tags as sub-elements. Browsers do not display the HTML tags, but use them to interpret the content of the page.
HTML can embed programs written in a scripting language such as JavaScript, which affects the behavior and content of web pages. Inclusion of CSS defines the look and layout of content. The World Wide Web Consortium (W3C), former maintainer of the HTML and current maintainer of the CSS standards, has encouraged the use of CSS over explicit presentational HTML since 1997.
Some of the advance level tags are:-
1. Images can improve the design and the appearance of a web page.
Images can be easily inserted at any section in an HTML page. To insert image in an HTML page, use the <img> tags. It is an empty tag, containing only attributes since the closing tag is not required.Just keep in mind that you should use the <img> tag inside <body>…</body> tag. The src attribute is used to add the image source i.e. URL of the image. The alt attribute is for adding alternate text, width for adding width, and height for adding the height of the image.
2.Adding image as background-To add a background image on an HTML element, use the HTML style attribute and the CSS background-image property. There are various ways in which images can be added to a web page to make it look captivating & appealing. One of such ways is adding background image. In this blog we will understand how we can add background images in a webpage using HTML & CSS. The most common & simple way to add background image is using the background image attribute inside the <body> tag.
If the background image is smaller than the element, the image will repeat itself, horizontally and vertically, until it reaches the end of the element:
3.For adding Quotations-we use tags like <blockquote>,<q> HTML elements.
#Using <blockquote>
4. For adding address in- HTML the <address> tag defines the contact information for the author/owner of a document or an article.The contact information can be an email address, URL, physical address, phone number, social media handle, etc.The text in the <address> element usually renders in italic, and browsers will always add a line break before and after the <address>.
5. Creating a table in HTML-The <table> tag defines an HTML table.
Each table row is defined with a <tr> tag. Each table header is defined with a <th> tag. Each table data/cell is defined with a <td> tag.
By default, the text in <th> elements are bold and centered.
By default, the text in <td> elements are regular and left-aligned.
#TABLE with borders-
6. Symbols can also be added in HTML-
To diplay the euro sign, €, with an entity name, a decimal, and a hexadecimal value:
More signs can be seen below:
7.Classes in HTML-The website HTML, generated Wikipedia content and the JavaScripts of Wikipedia define hundreds of classes and IDs. Most of these classes and IDs are used for styling using CSS and identify parts of the page that this styling should apply to.
The HTML <span> element is a generic inline container for phrasing content, which does not inherently represent anything. It can be used to group elements for styling purposes (using the class or id attributes), or because they share attribute values, such as lang. It should be used only when no other semantic element is appropriate. <span> is very much like a <div> element, but <div> is a block-level element whereas a <span> is an inline element.
We have two <span> elements with a class attribute with the value of "note". Both <span> elements will be styled equally according to the .note style definition in the head section:
To create a class named “city”; write a period (.) character, followed by a class name. Then, define the CSS properties within curly braces {}:
This is all for this time. Stay tuned for more such blogs.
