Como Fazer Uma Página Dentro De Uma Página

Índice:

Como Fazer Uma Página Dentro De Uma Página
Como Fazer Uma Página Dentro De Uma Página

Vídeo: Como Fazer Uma Página Dentro De Uma Página

Vídeo: Como Fazer Uma Página Dentro De Uma Página
Vídeo: criando links e botões para abrir páginas em html 2024, Abril
Anonim

Hypertext Markup Language (HTML) fornece a capacidade de dividir uma página em várias janelas - "frames". Cada um dos quadros pode ter sua própria fonte de Internet para exibir. Este mecanismo pode ser usado para inserir páginas de outros sites nas páginas do seu site.

Como fazer uma página dentro de uma página
Como fazer uma página dentro de uma página

É necessário

Bloco de notas do editor de texto

Instruções

Passo 1

O código HTML de uma página é um conjunto de instruções para o navegador informando onde na página cada um dos seus elementos deve ser exibido e como deve ser exibido. Essas instruções são chamadas de "tags" e para criar uma página que contenha uma ou mais outras, você precisa escrever o conjunto apropriado de tags. Começamos com as tags que criam um contêiner para todos os frames da página:

Essas são as tags de abertura e fechamento do contêiner - as tags que formam os quadros precisam ser colocadas entre elas. Em HTML, as tags têm "atributos" - eles contêm informações adicionais sobre as propriedades do elemento da página, cuja exibição especifica essa tag. Na tag de abertura do contêiner, você deve especificar um atributo que contenha informações sobre como o navegador deve dividir o espaço da página entre seus frames:

O atributo "cols" neste exemplo de código especifica que a página deve ser dividida verticalmente em dois quadros, com o esquerdo ocupando 20% da largura da janela e o direito 80%. Se, em vez do atributo "cols", você especificar o atributo "rows", a página será dividida horizontalmente:

Em vez de um número, você pode escrever um asterisco (*):

Isso significa que o segundo quadro receberá todo o espaço restante. Os tamanhos dos quadros podem ser especificados não em porcentagens, mas em unidades de medida que são mais frequentemente usadas no layout de página - em "pixels":

Passo 2

A tag HTML do próprio frame, que deve ser colocada no contêiner, é escrita da seguinte maneira: O atributo "src" da tag "frame" contém o endereço da página da web que o navegador deve carregar neste frame. Um endereço escrito dessa forma é chamado de "absoluto" - ele começa com o protocolo https://. Mas se esta é uma página do seu próprio site e está na mesma (ou subpasta) pasta, então você não precisa especificar o endereço absoluto, apenas o nome do arquivo e o caminho para a subpasta serão suficientes. Esse endereço será chamado de "relativo": - Por padrão, as bordas entre os quadros na página podem ser movidas com o mouse. Este recurso é desabilitado pelo atributo noresize: - Existem dois atributos que determinam o tamanho das margens entre os quadros - a altura da margem define a margem vertical (superior e inferior) e a largura da margem - horizontalmente (direita e esquerda): - Usando outro atributo - "rolagem" - você pode informar ao navegador as regras para as barras de rolagem do quadro: O valor "auto" especifica que as barras de rolagem devem aparecer conforme necessário, ou seja, quando o conteúdo não cabe dentro do quadro. Se você definir o valor como "sim", então este quadro sempre terá barras de rolagem, e o valor "não", ao contrário, impede a exibição de barras de rolagem - Se as páginas contidas no contêiner funcionarem com quaisquer scripts JavaScript que Para realizar operações em quadros adjacentes, pode ser necessário distinguir os quadros pelo nome. O atributo que contém o nome do quadro é denominado nome:

etapa 3

Essas definições HTML são suficientes para criar uma página simples de várias páginas de outros sites. Para fazer isso, você precisará de qualquer editor de texto, por exemplo, um bloco de notas padrão. Nele, crie um novo documento e escreva estas tags html:

Em seguida, salve esse código com uma extensão htm ou html - por exemplo, test.html. Tudo está pronto, se você abrir este documento com um navegador, o resultado ficará assim:

Página de dois quadros
Página de dois quadros

Passo 4

Existe outro tipo de moldura - "flutuante". Ele pode estar localizado em uma página normal, não dividido em quadros. Essa moldura possui atributos adicionais de largura e altura que definem suas dimensões. O código desta tag pode ter a seguinte aparência:

Recomendado: