Como criar uma página HTML simples

Como criar uma página HTML simples
Uma página da web é um documento na World Wide Web escrito em uma linguagem de marcação de hipertexto. Este idioma consiste em centenas de elementos, também chamados de “Tag”. Enquanto a folha de estilo em cascata pode ajudar com o HTML a fornecer propriedades de estilo aos elementos HTML.

Ao iniciar o desenvolvimento da web, os iniciantes podem não conhecer o método para criar uma página simples HTML e executá -la. Então, este manual demonstrará:

  • Pré -requisitos para criar uma página da web
  • Como criar uma página HTML simples?
  • Como estilizar uma página simples HTML?

Pré -requisitos para criar a página da web

Para criar uma página da web, os pré -requisitos são:

  • Editor de texto
  • Navegador da web

Editor de texto como pré -requisito para criar a página da web

Um programa de software de computador que permite aos usuários editar, armazenar e imprimir texto é um editor de texto. Vários editores de texto podem ser utilizados para fazer programas da web, páginas da web e muito mais, como código do Visual Studio, texto sublime, bloco de notas e assim por diante. Se você é iniciante, o bloco de notas é comparativamente fácil de usar. Mas para projetos grandes, é melhor usar qualquer outro editor como texto sublime ou código do Visual Studio.

Navegador da web como pré -requisito para visualizar a página da web

Um navegador da web é um software que leva você a qualquer lugar da Internet. Ele recupera informações e as exibe em uma tela.

Como criar uma página HTML simples?

Agora, vamos começar a criar uma página html simples passo a passo.

Etapa 1: Crie pasta vazia
Primeiro, crie uma pasta vazia como o repositório de nosso projeto:

Etapa 2: Editor de texto aberto
Para escrever o código HTML, primeiro, escolha o editor de texto de sua escolha. Por exemplo, usaremos o bloco de notas ++, e seu espaço de trabalho de alguma forma ficará assim:

Etapa 3: Adicione elementos HTML ao editor de texto
Os elementos HTML são usados ​​para construir diferentes componentes do documento HTML. Por exemplo, para adicionar um parágrafo,

Tag é usado, tags de cabeçote são denotadas como

,

,

,

,

, e
. Para adicionar uma imagem, uma tag pode ser utilizada. Todas essas tags são adicionadas nas tags iniciais e fechadas do elemento raiz .

Por exemplo, adicionamos o código de amostra HTML em nosso arquivo da seguinte forma:



Minha primeira página HTML


Html


Bem -vindo à minha primeira página HTML.



A imagem abaixo mostra um exemplo de código escrito no editor de notas ++:

Etapa 4: Salvar arquivo
Salve o arquivo HTML na pasta que você criou na primeira etapa, clicando no “Salvar”Opção como mostrado abaixo:

Como resultado, você será solicitado a especificar o nome do arquivo e seu tipo. Depois de fazer isso, clique no “Salvar”Botão como mostrado abaixo:

Etapa 5: Abra o arquivo com navegador da web
Para ver como o arquivo HTML aparece no navegador, siga as etapas abaixo da lista:

  • Primeiro, abra a pasta onde o arquivo html é salvo.
  • Selecione o arquivo e clique com o botão direito do mouse no arquivo. Como resultado, um menu suspenso será exibido.
  • Em seguida, selecione o “Abrir com”Opção e depois escolha o navegador que você deseja usar para abrir a página da web. Por exemplo, selecionamos “Google Chrome”:

Ao selecionar o navegador, o código HTML gerará o resultado da seguinte forma:

É assim que podemos criar uma página simples HTML. Você pode aplicar estilos a esses elementos HTML usando CSS.

Como estilizar uma página simples HTML?

CSS, ou folha de estilo em cascata, é utilizada para especificar como os elementos HTML são mostrados no navegador da web. Ele permite que os usuários apliquem várias propriedades de estilo aos elementos HTML para que a página da web pareça mais atraente e atraente.

Agora, vamos estilizar a página HTML criada acima com a ajuda das propriedades do CSS:

  • Primeiro, adicione uma tag na seção principal do arquivo html.
  • Dentro dele, H1 é usado para acessar o

    tag na qual aplicaremos propriedades diferentes.

  • Para adicionar a cor da fonte, utilize o “cor”Propriedade e defina seu valor como“vermelho”.
  • O "alinhamento de texto”O valor da propriedade é definido como“Centro”, O que significa que o cabeçalho será exibido no centro.
  • Então, para sublinhar o título, o “decoração de texto”A propriedade é definida como“8px sublinham cinza”, Onde 8px representa a largura da linha, o sublinhado é a propriedade de decoração e o cinza é a cor. Os usuários podem definir os valores da propriedade de acordo com suas preferências.
  • Da mesma forma, aplicaremos algumas propriedades ao

    elemento também.

Abaixo está o código para o cenário acima descrito:


Minha primeira página HTML

Salve o arquivo e abra -o no navegador da web:

Isso é legal! Aprendemos a criar uma página simples HTML e estilizá -la com algumas propriedades CSS.

Conclusão

Para desenvolver um site, primeiro, os usuários precisam aprender idiomas HTML e CSS, pois a linguagem HTML fornece a estrutura da página da web e, para embelezar as páginas da web, usamos as propriedades do CSS. Essas propriedades são definidas de acordo com a escolha do usuário. Para criar um arquivo HTML simples, você pode utilizar um editor de texto ou um editor de código e seguir o procedimento fornecido. Este manual explicou como criar uma página HTML simples com CSS com a ajuda da implementação prática.