Questões de Concurso sobre CSS

Em uma página web há um contêiner chamado trem, que possui a seguinte configuração CSS.

div.trem {

width: 200px;

height: 200px;

background-color: red;

animation-name: metro;

animation-duration: 4s;

}

...I... metro {

from {background-color: red;}

to {background-color: blue;}

}

Para que a animação chamada metro mude a cor de fundo do contêiner de vermelho para azul, a lacuna I deve ser corretamente preenchida por

Observe os códigos HTML e CSS a seguir:

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta charset="utf-8" />

<title></title>

<link rel="stylesheet" href="estiloProva.css"/>

</head>

<body>

<div class="figura1">

<div class="figura2">

</div>

</div>

</body>

</html>

Conteúdo do arquivo “estiloProva.css”:

.figura1 {width: 650px;height: 300px; border:5px dotted black; float: left; margin: 30px;}

.figura2 {width: 100px;height: 100px; position: relative; background-color: blue; top: 20px; left: 150px;}

A tela exibida pelo navegador conterá um retângulo com borda

De acordo com o conceito de herança em CSS, as propriedades de página com especificidade mais alta têm prioridade sobre as propriedades com especificidade mais baixa.

Para que, ao se posicionar o ponteiro do mouse sobre cada um dos links da página, a cor da letra do link mude para vermelha, deve-se utilizar para a página web a configuração CSS

No CSS, o seletor que localiza um elemento pelo seu atributo “id” é:

A propriedade display na linguagem CSS3 especifica como um elemento será exibido no layout da página web. Comparado ao display:block, a principal diferença é que o display:inline-block

Considere o fragmento de uma página web criada com HTML5 e CSS3.

<head>

<style>

[title~=carro] {

border: 5px solid #FF0000;

}

</style>

</head>

<body>

<img src="carro1.jpg" title="carro de corrida">

<img src="carro2.gif" title="carro lento">

<img src="carro3.gif" title="carro">

<img src="carro4.gif" title="viagem de carro">

<img src="moto" title="motocicleta">

</body>

A configuração CSS3 de borda

As unidades de medida usadas em CSS para ajudar na responsividade dos sites, que especificam medidas relativas a 1% da largura e 1% da altura da janela do navegador (viewport), são, respectivamente,

O Cascading Style Sheets (CSS) é conceituado como uma "folha de estilo" composta por “camadas” e utilizada para definir a apresentação em páginas da internet que adotam para o seu desenvolvimento linguagens de marcação, como XML, HTML e XHTML. O CSS define como serão exibidos os elementos contidos no código de uma página da internet e sua maior vantagem é efetuar a separação entre o formato e o conteúdo de um documento. A seguir são descritos os métodos de vinculação das folhas de estilo a um documento HTML.

I. Neste método, o CSS é carregado toda vez que um site é atualizado, o que pode gerar tempos de carregamento maiores. Não é possível usar o mesmo estilo CSS em várias páginas, pois este método fica configurado para apenas uma página. A vantagem é ser mais fácil compartilhar o template da página para uma pré-visualização.

II. Neste método, o designer gráfico trabalha com elementos específicos que usam a tag <style>.Cada componente precisa ser estilizado, não é o modo mais rápido de se usar códigos CSS. A vantagem é permitir fazer alterações em um único elemento.

III. Neste método, tudo é feito em um arquivo .css em separado, o que possibilita ao designer gráfico programar e planejar todo o conteúdo CSS de uma página em um documento. Permite posteriormente, anexá-lo ao arquivo HTML dessa mesma página. A maior vantagem é a diminuição do carregamento de sites.

Os métodos I, I I e I I I são denominados, respectivamente:

Analise o código abaixo utilizado pelo tipo de linguagem CSS.

Dado esse comando acima, como se apresentarão os elementos?

Ao utilizar a linguagem CSS podemos definir a largura dos elementos em pixels ou porcentagem. Referente à forma que escrevemos essa definição da largura, assinale a alternativa correta.

De acordo com o padrão W3C (World Wide Web Consortium), para se desenvolver um site em HTML (Hypertext Markup Language) é utilizado também a linguagem CSS (Cascading Style Sheets). Sobre a linguagem CSS, assinale a alternativa incorreta.

HTML, CSS e Javascript são tecnologias cujas funções se complementam no desenvolvimento de páginas Web. Analise as afirmativas a seguir sobre essas tecnologias e responda:

I. Um documento HTML é composto por elementos hierarquicamente organizados.

II. O elemento script permite associar código JavaScript aos documentos HTML.

III. Pode-se aplicar propriedades CSS a elementos HTML de três maneiras diferentes: inline style, internal style sheet e external style sheet.

Considere a página web abaixo.

<!DOCTYPE html>

<html>

<head>

<style>

..I.. {

color: #0000ff;

font-size:300%;

}

</style>

</head>

<body>

<h1 class="tit">História do Tribunal de Justiça</h1>

<p>A história do Tribunal de Justiça do Maranhão reflete a própria

evolução da Justiça maranhense, que...</p>

</body>

</html>

A instrução CSS que deve ser colocada na lacuna I para que somente na primeira letra do título seja aplicada a cor e o tamanho da fonte é:

A Internet evoluiu muito e os serviços oferecidos através da Web também sofreram mudanças significativas, ficando mais dinâmicos e atrativos. Uma característica muito interessante é a manipulação de objetos através das transformações. Estas dão a habilidade de manipulações básicas em elementos no espaço. CSS 2D Transforms Module Level 3 e CSS 3D Transforms Module Level 3 são duas especificações distintas para transformações que, combinadas com transições e animações, fornecem ferramentas poderosas para muitas ações. Uma dessas unidades/elementos “inclina o elemento ao longo do eixo X (e, se dois números forem especificados, Y)”. Assinale a alternativa que apresenta essa unidade/elemento.

Analise as construções exibidas a seguir para definição da propriedade CSS “padding” de um elemento.

Assinale o número de linhas que estão corretamente declarados.

Observe o código em HTML apresentado a seguir e responda as questões 34 e 35.

-

1. <!DOCTYPE html>
2. <html>
3. <head>
4. <style>
5. .center {
6. ----margin: VALOR
7. ----width: 60%
8. ----border: 1 px solid darkgray;
9. ----padding: 10px;
10. }
11. </style>
12. </head>
13. ...

-

A declaração de center (linha 5), define um elemento CSS do tipo:

A figura abaixo mostra o título de uma página formatada com CSS.

São João de Meriti_____

A instrução CSS que gera esse título com fundo na cor amarela, como mostrado, é:

O CSS3 possibilita o uso da função calc() para definir valores em CSS a partir de uma expressão matemática.

Acerca do CSS3, essa nova pseudoclasse que foi introduzida nessa versão, “é desenhada para funcionar quando o elemento selecionado se torna o destino ativo de um link (um identificador de fragmento na URL que aponta para ele)”. Assinale a alternativa que apresenta essa pseudoclasse.