Breve Resumo
HTML é uma linguagem de marcação utilizada na construção de páginas na Web. Documentos HTML podem ser interpretados por navegadores. A tecnologia é fruto da junção entre os padrões HyTime e SGML. HyTime é um padrão para a representação estruturada de hipermídia e conteúdo baseado em tempo.
CSS – Cascading Style Sheets é um mecanismo para adicionar estilo a um documento web. O código CSS pode ser aplicado diretamente nas tags ou ficar contido dentro das tags

Mesmo se você for iniciante no meio da programação provavelmente já deve ter ouvido falar sobre HTML. O HTML é uma linguagem muito fácil de se aprender e em pouco tempo você já poderá criar um website com facilidade. Com um pouquinho mais de tempo e dedicação, você poderá estilizar suas páginas utilizando o CSS, conseguindo um resultado mais profissional. O HTML e o CSS são utilizados para criar páginas web e atuam de forma complementar.

Quem usa HTML e CSS?

Todos os sites utilizam HTML e CSS de uma forma ou de outra. Você se lembra da época do Orkut quando enviávamos recados e depoimentos? Nessa época gostávamos de deixar eles mais bonitinhos…com fontes, cores, diferentes tamanhos, negrito, itálico, e mais uma infinidade de tags que podiam ser utilizadas… Sim, aquilo era HTML.

A sintaxe do HTML foi criada para ser de fácil entendimento tanto para nós quanto para a máquina, além disso você não precisa de nada mais do que um editor simples. Como vimos, HTML é uma linguagem de marcação.

Essas marcações são chamadas de tags, que são abertas e depois fechadas. É com as tags que dizemos para o navegador o que é um título, parágrafo, botão, formulário, dentre outros. Veja abaixo o nosso Hello World!

				
					<!DOCTYPE html>
<html lang="pt-br">
<head>
    
    <title>Elemento Digital</title>
</head>
<body>
    <p>Hello World</p>
<script>class RocketElementorAnimation{constructor(){this.deviceMode=document.createElement("span"),this.deviceMode.id="elementor-device-mode",this.deviceMode.setAttribute("class","elementor-screen-only"),document.body.appendChild(this.deviceMode)}_detectAnimations(){let t=getComputedStyle(this.deviceMode,":after").content.replace(/"/g,"");this.animationSettingKeys=this._listAnimationSettingsKeys(t),document.querySelectorAll(".elementor-invisible[data-settings]").forEach(t=>{const e=t.getBoundingClientRect();if(e.bottom>=0&&e.top<=window.innerHeight)try{this._animateElement(t)}catch(t){}})}_animateElement(t){const e=JSON.parse(t.dataset.settings),i=e._animation_delay||e.animation_delay||0,n=e[this.animationSettingKeys.find(t=>e[t])];if("none"===n)return void t.classList.remove("elementor-invisible");t.classList.remove(n),this.currentAnimation&&t.classList.remove(this.currentAnimation),this.currentAnimation=n;let s=setTimeout(()=>{t.classList.remove("elementor-invisible"),t.classList.add("animated",n),this._removeAnimationSettings(t,e)},i);window.addEventListener("rocket-startLoading",function(){clearTimeout(s)})}_listAnimationSettingsKeys(t="mobile"){const e=[""];switch(t){case"mobile":e.unshift("_mobile");case"tablet":e.unshift("_tablet");case"desktop":e.unshift("_desktop")}const i=[];return["animation","_animation"].forEach(t=>{e.forEach(e=>{i.push(t+e)})}),i}_removeAnimationSettings(t,e){this._listAnimationSettingsKeys().forEach(t=>delete e[t]),t.dataset.settings=JSON.stringify(e)}static run(){const t=new RocketElementorAnimation;requestAnimationFrame(t._detectAnimations.bind(t))}}document.addEventListener("DOMContentLoaded",RocketElementorAnimation.run);</script></body>
</html>
				
			

Sintaxe do CSS
Com o CSS você pode criar folhas de estilo, que são muito úteis e fáceis de serem utilizadas. Por exemplo, vamos criar uma folha de estilo chamada style.css e com os seguintes atributos:

				
					strong {
	color: blue;
}

h1 {
	font-style: italic;
}
				
			
				
					<html>
<head>
    <title>Elemento Digital</title>
    
</head>
<body>
    <p>Hello <strong>World</strong></p>
    <h1>Seja bem-vindo a Elemento Digital!</h1>
</body>
</html>
				
			

Quando abrirmos a página ele vai nos mostrar a frase “Hello World”. A palavra “World” está dentro da tag “strong”, então ela vai se comportar da maneira que estilizamos no arquivo CSS: em negrito e na cor azul. Já a frase “Seja bem-vindo a Elemento Digital!” aparecerá em itálico, conforme colocamos no nosso arquivo CSS. A maioria das páginas da Internet são escritas em HTML e estilizadas usando CSS, daí podemos ver a sua incontornável importância. Você pode começar a aprender a criar suas próprias páginas e, mais para frente, ter a capacidade de desenvolver telas para sites, aplicativos mobile, sistemas web e desktop.

Copyright © 2022 por Elemento Digital – Política de privacidade | Mapa do site

Garantimos 100% de segurança de suas informações. Não compartilharemos os detalhes fornecidos acima com ninguém. Seu e-mail não será usado para spam.

Em que podemos ajudar?