Testing HTML Code In a Browser

HyperText Markup Language, commonly known as HTML is the markup language used by the Standard for creating web pages.

HTML Includes CSS and JavaScript.

HTML is the basic technology used by most web pages for visual so that the website interface looks attractive when viewed by users

This is an HTML code tester, insert the HTML code in below!

What is HTML?

Testing HTML Code In a Browser
It is a programming language used to develop web pages. HTML abbreviation stands for  HyperText Markup Language ( "hypertext markup language". This language allows structured text documents and relies on labels to determine how to display text and attributes that can take those tags.

BASICS OF HTML CODE


1. The parts of the website

All web page is divided into two main parts: the header and the body (head and body).

The header is "not visible" part of the website. This means that everything stated there will not appear on the page as such, but nevertheless it is an important part: hence the included meta tags used to describe the page (essential for SEO positioning ), the title of the page, the language , information related to  style sheets , etc.

In the body all tags are introduced that allow us to format the document .

As this guide is intended to minor changes in the body of the web page tags describe body and not mention anything else about the head. But if you need to delve into the subject or more languages besides html, you leave this website , which is excellent for small queries you need.


2. Titles

Tags that define the titles can be used to mark the title and / or the various sections  which form the document, or simply to highlight any text. There are six types of securities, ranging label No. 1 (largest) through 6 (smallest). This is also very important for search engine optimization, since you're showing them that what is between these tags is important and characteristic of your website.

3. Paragraphs

Paragraphs are delimited with tags <p> ... </ p> . A paragraph is a block of text displayed separately from the rest by a line break. If within the paragraph we want to make a jump, but is still considered a single paragraph (give a word intro) would write the label <br> .

However, if you want to write so free and you detect line breaks, you only have to write within the <pre> tag ... </ pre>. The only drawback to this is that if you copy text from another document and also has lists, titles, bold ... you may not detect it all.

4. Lists

There are three types of lists, ordered , the unordered and definition lists .

For labels use ordered lists <ol> ... </ ol> to delimit the list, and unordered lists, labels <ul> ... </ ul> . To insert each list item labels are introduced <li> ... </ li> .

Lists of definitions, insert the tags <dl> ... </ dl> to delimit the list, <dt> ... </ dt> and <dd> ... </ dd> for the title and definition respectively.

5. Table

To make a table we must consider that is being done from left to right and top to bottom. That is, we started developing the first row, within it, certain columns there, and then the next row.

The table must be enclosed in the <table>, specifying the edge we want. Commands that define us are rows <tr> ... </ tr> , and the columns <td> ... </ td> . To combine multiple columns or rows use the attributes colspan or rowspan respectively. If you want to highlight a row or column to behave as title use <th> ... </ th> . I'll show you an example.

6. Links

Links allow us to access other pages, web sites, files (music, videos, software, images, etc.) allow the network to download files and access other parts or sections within a document. Label are made with <a href ="https://safebusinessresource.blogspot.com/"> ... </a> . Here I must mention a very important attribute:  target = "_ blank" to the link opens in a new browser tab.

7. attributes and styles

Finally, I wanted to make a selection of attributes and styles most commonly used in html. Typically styles are specified in the file css , but as I pretended that this guide will serve for small sporadic changes, consider applying styles directly into an HTML tag is a convenient option that allows us to solve problems we can not afford our cms, or because the template does not give us choice.

Then I show a number of attributes . They are always placed within a label, for example as follows: <body bgcolor = "blue"> ... </ body>
  • background = "file-name" : Background image
  • bgcolor = "color" : Background color
  • border = "number" : Size edge of an image or table
  • bordercolor = "color" : Border Color
  • width = "px or%" : an image width, board or block. You can be specified in pixels or percentage, 100% being the full screen size
  • height = "px or%" : Height of an image, table or block
  • align = "top, middle, bottom, left, right" : Alignment of an image, text, title, ... table top, middle, bottom, left or right, respectively

I enclose a list of colors that recognizes html by name. For all other colors, you must enter the code specifically in format  hexadecimal

Finally, I show you a small list of styles more, which in this case are labels including text which will want to apply that style:
  • Negrita: <b>…</b> o <strong>…</strong>
  • Cursiva: <i>…</i>, <em>…</em>, <cite>…</cite> o <dfn>…</dfn>
  • Subrayado: <u>…</u>
  • Tachado: <s>…</s>
  • Subíndice: <sub>…</sub>
  • Superíndice: <sup>…</sup>
  • Letra pequeña: <small>…</small>
  • Letra grande: <big>…</big>


Do you know more tags and attributes that are important?

This is my little guide support with HTML code. I hope it has been helpful for you. I recommend practicing in any text editor with a template either, where you can experience ... "what will happen if I change this tag for this one?" Reloads the page and see the result. It is the most simple and useful to learn and discover new way tags and attributes.

With this article sought to explain the basics of html, but I'm sure I left too basic concepts that should be included. Enter both and tell me your opinion, and I will improve is guide.

And of course, if you thought interesting and you liked it, Share!