HTML and CSS basics

The HTML markup language tells the browser how contents are structured, for example, where images, texts, hyperlinks, and so on, are located. For this structuring, there are various commands, so-called HTML tags.

HTML tag

An HTML tag is an individual HTML command. HTML tags mark the start and end of a particular area.

In general, a tag follows the following scheme:

Copy
<tagname>Content</tagname>

A tag can have various attributes. The most important attributes for formatting are "class" and "id".

"Text field" example:

Copy
<input type="text" id="email" class="login">

The elements are formatted using CSS. Within the CSS file, a particular tag can be addressed using the tag name, class or ID.

Addressing using the tag name

Copy
input{
    // style instructions
    } 

All HTML "input" tags are addressed with this notation. The input tag is used for various form input fields. Text fields, radio buttons, check boxes and buttons are reproduced using the "input" tag. The CSS instructions that are defined within the curly brackets therefore apply to all these elements.

More specific addressing is possible using classes and IDs.

Addressing using classes and IDs

To address classes, a dot is always placed in front of the class name.

Example

Copy
.login{

    } 

IDs, on the other hand, are referenced using a hash.

Example

Copy
#email{

    } 

We will present in the following the Web developer tools that simplify the design of dynamic Web pages.