![Notícia com subtítulo](https://www.gov.br/gestaodeconteudo/pt-br/manuais-e-tutoriais/uso-de-classes-em-capas/linhas-de-destaque/linha-destaque-topo-adaptavel/linha-destaque-topo-adaptavel/@@govbr.institucional.tile.nitf/eea67383-b18c-4dec-a85f-e9d397b7d9ab/@@images/6594b5cd-13e0-4438-ba7b-01dd6d58e968.jpeg)
Linha Destaque Topo Adaptável
Como usar
Crie uma linha no topo da capa com a classe Linha Destaque Topo Adaptável e insira nela um Tile de Notícia.
Apenas no Desktop, o tile irá ocupar toda a largura e altura da tela do usuário, mantendo o cabeçalho do portal.
Em Tablets e Smartphones, a imagem não sofre alterações, é apenas redimensionada proporcionalmente de acordo com a tela do dispositivo. Neste caso, os texto são exibidos abaixo da imagem sobre um fundo escuro.
Caso necessário, você pode também adicionar à linha a classe Degrade para destaque topo, para adicionar um fundo escuro sob o texto.
Imagens
A imagem do Tile de Notícias deve ter, no mínimo, 1600px de largura, para ser adequadamente exibida em todas as telas. Ela será cortada para o tamanho exato da tela do dispositivo.
Você pode usar as classes de Fixar a Imagem para definir a posição do assunto principal da foto, e previnir que ele seja cortado.
Múltiplas imagens para dispositivos diferentes
Você pode usar imagens diferentes para desktops, tablets e smartphones. Para isso, basta criar um Tile de Notícia diferente para cada imagem, e configurá-los usando as Classes de Visibilidade.