Postagens

Mostrando postagens de julho, 2020

CSS: Introdução

Imagem
  CSS: introdução (Elivelto Ebermam)   A linguagem de marcação de hipertextos (HTML) é usada na construção da estrutura básica das páginas Web. Já as folhas de estilo em cascata (do inglês: cascading style sheets, abreviado por CSS) são um mecanismo para adicionar estilo (como fontes, cores, espaçamentos) ao documento web [1]. Popularmente falando, a função do CSS é deixar as páginas web bonitas. A sintaxe do CSS é diferente do HTML, ou seja, a forma de escrever é um pouco diferente.   Código CSS No CSS escrevemos regras, e essas regras dizem como que os elementos HTML serão mostrados na página. Veja um exemplo: Agora vamos detalhar um pouco mais: O primeiro elemento de uma regra CSS é o seletor. O seletor é o elemento que queremos aplicar a regra. No exemplo o nome do elemento é p, e p é usado para parágrafo lá no HTML (tag <p> lembra?). Assim a regra será aplicado aos parágrafos da página w...
1 comentário
Leia mais

HTML: botoes

Imagem
HTML: botões (Elivelto Ebermam) Botões tem diversas finalidades em uma página web, mas podemos dizer que a principal delas é enviar um formulário. Existem outras formas de inserir um botão em HTML, mas usaremos a tag <button> para inserir um botão. Normalmente a tag é acompanhada do atributo type. Existem dois tipos principais de botões para um formulário: submit e reset. Botão do tipo submit A função desse botão é enviar os dados do formulário para o servidor. Quando você clica nesse botão, todos os dados do formulário são enviados para o servidor. Por exemplo, em um formulário de login e senha, quando você preenche seu login e sua senha, eles são enviados quando você clica no botão de enviar. Veja um exemplo: <form action=”servidor.php” method=”post”>     Login:     <input type=”text” name=”login”> <br>     Senha:     <input type=”text” name=”senha”> <br> ...
Postar um comentário
Leia mais

HTML: listas

Imagem
HTML: Listas (Elivelto Ebermam) Em html temos basicamente três tipos de listas: listas ordenadas, listas desordenadas e listas de definição. Lista ordenada Nesse tipo de lista, os itens da lista tem um determinada ordem, por exemplo uma numeração. Para inserir uma lista ordenada usamos a tag <ol>, e para cada item da lista usamos a tag <li>, veja um exemplo:     <ol>        <li> Brasil </li>        <li> Estados Unidos </li>        <li> China </li>     </ol> Lembrando que, para uma página html, não basta escrever apenas o trecho acima, é necessário escrever toda a estrutura da página. Veja o exemplo abaixo: <html>     <head>         <title> Exemplo </title>     </head>  ...
Postar um comentário
Leia mais

HTML: formulários - select

Imagem
HTML: select (ou menu de opções ) (Elivelto Ebermam) Select é um tipo de campo que permite selecionar opções em uma espécie de caixa clicável. Veja a imagem abaixo:   Como observado, o campo select é uma caixa de texto, onde há um texto e uma seta apontada para baixo ao lado. Ao clicar nessa seta, abre-se um menu de opções e o usuário pode selecionar uma opção. Ao clicar em uma opção, o menu de opções some, ficando apenas a caixa de texto novamente, porém o texto dela irá ser o item que você selecionou. E qual é o código do select em HTML? Uma estrutura genérica para ele é a seguinte:   A tag <select> deve conter o atributo name, o valor (ou seja, qual nome você vai atribuir a ele) você que define. Entretanto temos que usar também a tag <option> para inserir algumas opções para o usuário escolher, afinal, um menu de opções sem opções não faz sentido. Tag <option> Essa tag i...
Postar um comentário
Leia mais

HTML: quebra de linha e linha horizontal

Imagem
HTML: quebra de linha e linha horizontal (Elivelto Ebermam) Em html existe uma tag específica para saltar linhas, essa tag é a <br>.   Essa tag tem apenas abertura:     Primeira linha <br> Segunda linha Lembrando que, para uma página html, não basta escrever apenas o trecho acima, é necessário escrever toda a estrutura da página. Veja o exemplo abaixo: <html>     <head>         <title> Exemplo </title>     </head>     <body>         Primeira linha <br> Segunda linha     </body> </html> Se inserimos esse código no editor online do site W3Schools [1], disponível no link https://www.w3schools.com/html/tryit.asp?filename=tryhtml_default , e clicarmos em “run” temos o seguinte resultado: ...
Postar um comentário
Leia mais