Logo Passei Direto
Buscar

Análise de Sistemas

Outros
Web design responsivo usa HTML e CSS para que uma página web seja adequadamente apresentada em diversos tipos de dispositivos, como celulares, tablets, computadores, desktop etc. CSS3 introduziu uma nova técnica chamada media query que utiliza uma instrução para indicar que um bloco de propriedades CSS será aplicado somente se uma determinada condição for verdadeira.
Por exemplo, para executar um bloco de propriedades CSS, somente se a janela do navegador for menor do que 768px, utiliza-se a instrução
(A) @media only screen and (max-width: 768px) {/* propriedades CSS */}
(B) @mediaQuery only screen-max-width: 768px {/* propriedades CSS */}
(C) @apply if (screen >= 768px) {/* propriedades CSS */}
(D) @mediaQuery only screen on max-width: 768px {/* propriedades CSS */}
(E) @media if (screen >= 768px) {/* propriedades CSS */}
User badge image
Praticando Para o Saber

há 2 anos

User badge image
Praticando Para o Saber

há 2 anos

Prova
12 pág.

Prova

Respostas

User badge image

Ed Verified user icon

há 2 anos

Para determinar a instrução correta que utiliza media queries no CSS3, vamos analisar cada uma das opções apresentadas: (A) @media only screen and (max-width: 768px) {/* propriedades CSS */} - Esta é a sintaxe correta para uma media query que aplica estilos quando a largura da tela é menor ou igual a 768px. (B) @mediaQuery only screen-max-width: 768px {/* propriedades CSS */} - Esta opção está incorreta, pois a sintaxe "mediaQuery" não existe e falta o operador "and". (C) @apply if (screen >= 768px) {/* propriedades CSS */} - Esta opção está incorreta, pois "apply" não é uma palavra-chave válida para media queries e a condição não está na sintaxe correta. (D) @mediaQuery only screen on max-width: 768px {/* propriedades CSS */} - Esta opção está incorreta, pois "mediaQuery" não é uma palavra-chave válida e "on" não é usado na sintaxe de media queries. (E) @media if (screen >= 768px) {/* propriedades CSS */} - Esta opção está incorreta, pois "if" não é uma palavra-chave válida para media queries. Portanto, a alternativa correta é: (A) @media only screen and (max-width: 768px) {/* propriedades CSS */}.

Essa resposta te ajudou?

0
Dislike0

Ainda não achou a resposta?

  • Integrado com os principais modelos de IA do mercado
  • Respostas em segundos
  • IA treinada para estudantes brasileiros.
PasseIA logoEvolua sua forma de estudar

Cadastre-se ou realize login

Ainda com dúvidas?

Envie uma pergunta e tenha sua dúvida de estudo respondida!

Essa pergunta também está no material:

Prova
12 pág.

Prova

Mais perguntas desse material

Assinale a opção que indica a propriedade usada no CSS3 para definir o alinhamento de um elemento inline com relação ao seu elemento-pai.
A alignment-baseline
B alignment-adjust
C background-image
D background-position
E line-boxes

Hoje é um efeito comum em páginas Web os links serem sublinhados apenas quando o internauta posicionar o ponteiro do mouse sobre eles.
A propriedade CSS que permite retirar ou colocar o sublinhado nos links é:
A. text-decoration.
B. link-style.
C. text-outline.
D. link-style-type.
E. underline.

Um profissional estava desenvolvendo uma página web utilizando HTML e CSS com uma técnica conhecida como tableless. Criou então o layout da página utilizando contêineres com bordas discretas para agrupar elementos de acordo com um conjunto de características. Quando adicionou elementos nos contêineres, percebeu que estes elementos ficavam grudados nas laterais. Para definir, então, uma margem interna de mesma medida, em todos os lados dos contêineres, utilizou o atributo CSS
(A) stretching.
(B) padding.
(C) margin.
(D) default-margin.
(E) margin-length.

Ao visualizarmos um site (ou aplicativos e sistemas), em diferentes dispositivos, esperamos que ele seja redimensionado para a largura disponível do dispositivo automaticamente, sem perda de experiência. Sobre interfaces de aplicativos móveis, considere os procedimentos abaixo. I - Mostrar na tela o progresso de alguma ação. II - Usar duas barras de navegação: uma no topo, indicando a página em que o usuário está, e uma na parte inferior da tela, com links para outras páginas. III - Usar a meta tag viewport para definir uma largura máxima ou mínima de acordo com a resolução da tela do dispositivo. IV - Definir um event listener para cada evento, após determinar o nome dos eventos de um dispositivo. V - Usar uma action bar no topo da tela, seguida por uma barra de navegação imediatamente abaixo. Quais dos itens acima apresentam boas práticas para implementação de interfaces com o usuário em aplicações móveis e aplicáveis a qualquer dispositivo e aplicativo?
A. Apenas III e V.
B. Apenas I, III e IV.
C. Apenas I, II e IV.
D. Apenas II e V.
E. Apenas I e V.

O teste de resposta móvel em uma variedade de dispositivos e plataformas móveis é extremamente importante, isso porque a experiência do usuário em um dispositivo móvel comparado ao de desktops é muito diferente. Mas o teste real, em todos os dispositivos móveis existentes, não é nada prático para a maioria dos desenvolvedores, especialmente quando há problemas como código HTML/CSS/JavaScript ofiucado, HTTPS implementado incorretamente, inconsistências do navegador, desempenho de carregamento da página e assim por diante. Assinale a opção correta:
A. Uma técnica simplificada para testar design responsivo que alguns adotam, é redimensionar o tamanho da janela do navegador para corresponder aos tamanhos da janelas de visualização de smartphones. esse teste é muito preciso e portanto a opção mais escolhida no mercado.
B. Para a tipografia responsiva, os designers descobriram que o texto do corpo geralmente deve ter entre 100 e 155 caracteres por linha.
C. Para a tipografia responsiva, os designers descobriram que o texto do corpo geralmente deve ter entre 500 e 550 caracteres por linha.
D. Para que o design responsivo funcione bem, é especialmente importante testar sites e aplicativos em diferentes tamanhos de viewport.
E. Um truque muito simples para testar layouts, sugerido por Trent Walton (2012), é adicionar um asterisco após 200 e 255 caracteres. Se os dois asteriscos aparecerem na mesma linha em uma largura de viewport especifica, o tamanho da fonte não precisará ser alterado.

O CSS tem a tarefa de separar o conteúdo do site de sua apresentação visual, alterando elementos como cor do texto, fonte e espaçamento entre blocos, assim como todo o aspecto estético de uma página. No CSS, o seletor que localiza um elemento pelo seu atributo "id" é:
A. #id
B. .id
C. Jd
D. id
E. Jd

O design responsivo é um método que permite que o conteúdo do site e o design geral seja adaptado com base no dispositivo que o usuário utiliza para visualizá-lo. Em outras palavras, é fundamental que um site seja responsivo para que ele possa ser bem visualizado em qualquer tipo de dispositivo. Um Técnico em Web Design necessita desenvolver um site que apresente a propriedade da responsividade, segundo a qual:
A. Sites com essa característica não são apropriados para monitores do tipo touchscreen.
B. A exibição de um site deve se adaptar a diversos valores de resolução dos dispositivos atualmente utilizados para acessar a web.
C. No acesso a sites responsivos, o usuário deve especificar qual é o navegador a ser utilizado.
D. Não é possível a exibição de figuras e gráficos em sites com essa característica.
E. Os sites são desenvolvidos especificamente para os dispositivos de cada fabricante, não servindo a dispositivos de outros fabricantes.

Grids são um recurso útil para os designers criarem o layout das páginas de um website. O grid é capaz de guiar os olhos dos usuários pelo conteúdo, organizar as informações de forma simples e criar uma unidade visual entre as diferentes seções de um website. Sobre grids, é correto afirmar:
A. Se um grid for criado para um layout de página, os elementos visuais e objetos deverão segui-lo para melhorar a legibilidade dos elementos.
B. Deve ser visível na página, para os usuários, através de linhas horizontais e verticais.
C. A utilização de uma grid depende da adoção do elemento float pelo navegador.
D. Os grids (grades) são conjuntos de linhas verticais e horizontais que auxiliam na organização do conteúdo de forma uniforme, dentro do espaço determinado.
E. Para adicionar flexibilidade a um grid, deve-se usar a menor quantidade de colunas possível.

Trabalhar com web design responsivo não significa que apenas os seus layouts poderão ser alterados com base nas características do dispositivo, mas também o conteúdo. Tornar uma imagem ou um vídeo responsivo é, na verdade, algo simples.
Ao tentarmos exibir um conteúdo de imagem maior ou menor do que uma imagem original que não é responsiva, podemos usar o atributo e para fornecer diversas imagens de origem adicionais junto com as dicas que auxiliam o navegador a escolher a correta. Assinale a alternativa que preenche corretamente as lacunas.
A. alt/padding
B. margin/padding
C. height/width
D. srcset/sizes
E. img/alt

Mais conteúdos dessa disciplina