Tags do not understand much

Asked

Viewed 88 times

-2

Good evening I would like to know all about Tags, not only the basics as <html></br><h1> etc... but like what each one does for example I can’t figure out some of these elements.

dropbtn {
    background-color: #4CAF50; - cor do fundo
    color: white; - cor da letra
    padding: 16px; não sei
    font-size: 16px; tamanho da font
    border: none; não sei
    cursor: pointer; não sei
position: relative; não sei
    display: inline-block; não sei
  • 2

    You should probably start by studying for some book on the subject. You know that HTML tags and CSS properties are different things, right? In your question it seems that you would not know how to differentiate very well.

  • In addition to the tips below, follow a very complete guide on CSS. CSS Reference

2 answers

1

It would be very helpful to explain one by one. The best thing to do is to look for some tutorials CSS and HTML. This, nowadays, has a lot of content on the internet. But I will try to explain some of them:

padding:

It puts a kind of margin in between the contents and the box. An image that can help you:

inserir a descrição da imagem aqui

In this image, we see the content Hello Word that is inside a div (just to illustrate) in yellow. Padding makes this margin between the point inside the box and the content (hello world)

font-size:

As its name proposes, it is the font size, ie the text size.

border:

It serves for you to configure the edges of the element, such as the type of edge (line, strokes, etc.), border color, etc..

cursor:

With its own says, it moves the mouse cursor, enabling for example, when passing the mouse on a link the mouse is the "little hand" or the pointer cursor, among several other options.

position:

It moves the position of an element of the screen. For example, it is possible to create a div and with the position tell it to stay in the center of the screen.

display:

Like the example you quoted, the inline-block it works to leave elements in line (next to each other) but with the block style. There is for example only the block which leaves the elements below each other.

Do a search for css, like the links below:

http://www.maujor.com/tutorial/joe/cssjoe1.php

https://www.w3schools.com/css/

0

Before starting development with HTML5 and CSS3 it is good to have a general basic notion about the web development environment.

1 - There is a difference between HTML tags and CSS styling commands. Tags are the ones you quoted: <html>,</br>,<h1>, etc. Now the code you will see below is a css code with a set of commands that view styling the elements created by these tags.

2 - It is good you put your face to learn, fall on top. Here below I will leave the link of some sites that have good content so you can use learning.

MDN: https://developer.mozilla.org/en-US/
Udacity: https://br.udacity.com/course/intro-to-html-and-css--ud304/

.dropbtn {
    background-color: /* #4CAF50; - cor do fundo */
    color: white; - /* cor da letra */
    padding: 16px; /* Padding é uma maneira de você aumentar o tamanho de um elemento com espaço "vazio" */
    font-size: 16px; /* tamanho da font */
    border: none; /* Border é uma borda para o elemento em questão, isso faz com que o elemento não tenha borda */
    cursor: pointer; /* Faz com que o cursor do mouse tenha um estilo estilo especifico */
    position: relative; /* Torna a posição do elemento relativo ao elemento pai dele na hierarquia. */
    display: inline-block; /* Demonstra o comportamento do elemento no seu display, se você substituir o valor "inline-block" por "none" o elemento desaparecerá, por exemplo. */
}

Browser other questions tagged

You are not signed in. Login or sign up in order to post.