Tecnologia da Informação (TI): HTML

Mostrando postagens com marcador HTML. Mostrar todas as postagens

sábado, 15 de dezembro de 2018

Curso Web Design Responsivo com HTML5 e CSS3

Vamos falar um pouco do Curso Web Design Responsivo com HTML5 e CSS3.

O curso de Web Design Responsivo com HTML5 e CSS3 ensina do zero a criar um site profissional e responsivo, utilizando HTML5 e CSS3, além de noções de Bootstrap e metodologia BEM e o editor de texto Sublime Text.

Ele é dividido em sete capítulos práticos que mostram inicialmente a teoria aplicada a pequenos exemplos e depois, passo a passo, à construção do site profissional proposto no curso.

Para acessar o curso é bem simples, basta clincar nesse link (Aqui)

Detalhes:

Sublime Text é um editor de texto extremamente poderoso e bastante usado para criar código-fonte.

HTML é responsável por construir a estrutura, a semântica e o conteúdo de páginas web. Na sua versão 5, foram adicionados novos elementos, atributos e comportamentos.

CSS3 define estilos para páginas web, dando uma nova roupagem em todos os aspectos de design do layout e isolando a estilização das págínas HTML.

Bootstrap é um framework web, front-end e de código-fonte aberto para desenvolvimento de componentes de interface de aplicações web, usando HTML, CSS e JavaScript.

BEM consiste em um padrão de nomeação de classes para os elementos de marcação HTML, baseado na função estrutural do elemento.

Ao final do curso você será capaz de criar um site responsivo (front-end), com dezenas de recursos e com um código-fonte de qualidade.

sexta-feira, 14 de dezembro de 2018

Curso de HTML e CSS + Brinde

Aprenda a usar a linguagem HTML e CSS e Desenvolva um ótimo site basta apenas acessar o link (Aqui).

Você ainda recebe no seu e-mail um link de curso de PHP de graça no seu e-mail.

HTML significa Hyper Text Markup Language e é a linguagem de marcação de hipertexto, ou seja, é a linguagem na qual são escritas as páginas da Web, interpretada pelo navegador.

As informações estão ligadas na forma de páginas ligadas entre si. A página é transferida de um computador remoto para o usuário, onde o browser faz o trabalho de interpretar os códigos naquele documento e mostra a página que o usuário vê.

A Web está estruturada em dois princípios básicos: HTTP(Hiper Text Transfer Protocol) e HTML (Hiper Text Markup Language).

HTTP é o protocolo de transferência de hipertexto, ou seja, é o protocolo que permite a navegação na Web, com o simples clicar do mouse sobre o texto (ou imagem) que esteja associado a outro link.

O curso traz todas as dicas e macetes para desenvolver uma página completa em HTML e CSS.

terça-feira, 25 de março de 2014

Usando comando Selection - CSS

Faz o seguinte comoando no CSS.

<!DOCTYPE html>
<html>
<head>
<style>
:selection {color:red;background:yellow;}
</style>
</head>
<body>

<h1>Tente selecionar algum texto nesta página </h1>

<p>Este é um parágrafo. </p>

<div>Este é um texto em um elemento div.</div>

</body>
</html>

quinta-feira, 15 de julho de 2010

O que é seletor na pagina?

Seletor é uma entidade que identifica um elemento HTML ou define uma classe ou pseudo classe na qual a regra de estilo será aplicada.

Exemplo: p {font-size: 12px;}

domingo, 6 de junho de 2010

Inserindo Imagens na Página HTML

Olá, como sabemos os documentos HTML precisam trabalhar rapidamente. Por esse motivo um documento HTML não pode conter muitas imagens e nem imagens muito grande, por exemplo, os BMP (bitmap) tornam a visualização das imagens muito lenta.
As imagens que aparecem na Internet podem estar nos formatos GIF e JPG, que são os mais utilizados. Nessa aula tomaremos por base esses dois tipos de imagens.

IMG: A Tag IMG é a responsável por inserir uma imagem em um documento HTML.

Src: indica o nome da imagem ou o endereço onde a imagem está localizada.

Align: define o alinhamento da imagem, podendo trabalhar tanto no alinhamento vertical da imagem quanto no alinhamento vertical da primeira linha de texto em relação à imagem. Pode ser: left (esquerda), center (centralizado), right (direita).

Alt: define um nome alternativo, que é mostrado enquanto a imagem não é carregada. Após o carregamento da imagem esse texto passa a ser mostrado quando a imagem recebe o foco do ponteiro do mouse.

Border: define a espessura da borda da imagem, caso se deseje inserir uma. Essa espessura é dada através de números inteiros.

Width/Height: definem, respectivamente, largura e altura da imagem e devem ser passadas em pixel. Se apenas um desses parâmetros for inserido, o outro será ajustado de forma automática, sem distorcer a imagem.

Lowsrc: define uma figura de apresentação inicial, útil em páginas que contém muitas imagens ou imagens muito pesadas.


                          alt=”Meu Amigo Tux”
             border=”2”
             width=”100”
             height=”100”
             lowsrc=”tux2.jpg”>

quinta-feira, 28 de janeiro de 2010

Botão HTML

botao a{text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
color: #000000;
background-color: #F2DBB9;
background-image: url(http://img10.imageshack.us/img10/5389/overuar.jpg);
width: 210px;
text-indent: 5px;
height: 30px;
display: block;
line-height: 30px;
font-size: 12pt;
}
.botao a:hover{
color: #000099;
background-color: #cbe1ec;
background-image: url(http://img254.imageshack.us/img254/6578/outa.jpg);
}

Assim fica bem fácil localizar esse código dos botões quando quiser fazer alterações nele, sua pagina editar html ficará assim:

/* Primary layout */
.botao a{text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
color: #000000;
background-color: #F2DBB9;
background-image: url(http://img10.imageshack.us/img10/5389/overuar.jpg);
width: 210px;
text-indent: 5px;
height: 30px;
display: block;
line-height: 30px;
font-size: 12pt;
}
.botao a:hover{
color: #000099;
background-color: #cbe1ec;
background-image: url(http://img254.imageshack.us/img254/6578/outa.jpg);
}
body {background-color: $mainBgColor;

Então clique para salvar, agora vamos colocar os links onde usaremos esses botões, entre na pagina layout, clique em adicionar gadget, html/javascript e cole esse código:

Botão1
Botão2
Botão3
Botão4

O que é a linguagem HTML?

HTML (acrônimo para a expressão inglesa HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto) é uma linguagem de marcação utilizada para produzir páginas na Web. Documentos HTML podem ser interpretados por navegadores. A tecnologia é fruto do "casamento" dos padrões HyTime e SGML.