Informática – Parte 21 Prof. Márcio Hunecke · Google Chrome, Opera, Internet Explorer 9,...

Escriturário

Informática – Parte 21

Prof. Márcio Hunecke

www.acasadoconcurseiro.com.br 3

Informática

CSS 3

É no CSS (Cascading Style Sheets) que se define estilos para páginas web com efeitos de transição, imagem, e outros, que dão um estilo novo às páginas Web 2.0 em todos os aspectos de design do layout.

A principal função do CSS3 é abolir as imagens de plano de fundo, bordas arredondadas, apresentar transições e efeitos para criar animações de vá-rios tipos, como um simples relógio de ponteiros.

Isso se deve aos novos browsers que estão chegando, com suporte à essa linguagem, como o Google Chrome, Opera, Internet Explorer 9, Safari e Mozilla Firefox. Assim, o CSS3 facilitará o trabalho dos que trabalham com web e também dos usuários, pela variedade de transforma-ções na apresentação de um website.

A atribuição dos efeitos visuais pode ser realizada de três formas distintas

Inline – Um conjunto de efeitos para cada TAG

< h1 style="color:blue;margin-left:30px;" >This is a heading< /h1 >

Interno – Um conjunto de efeitos para a página

<style type="text/css"> ...estilo... </style>

Externo – Um arquivo separado (extensão .css)

<link rel="stylesheet" type="text/css" href="estilo.css"/>

Formato e exemplos dos efeitos

• Seletor – Propriedade – Valor – body {color: green}

• Color: blue, red, yellow, violet, green, black ou em hexa (cor do texto)

• Text-decoration: none, underline (sublinhado)

• Backckground-color: blue, red, yellow, green, black (cor do fundo)

• Font-size: 30px

• Font-family: Arial, Verdana

www.acasadoconcurseiro.com.br4

• Text-shadow (efeitos de sombra)

• Margin-left: 30px (margem esquerda -right, -top, -bottom)

• Comentários: /* texto comentado */

Margin e Padding

Margin refere-se à margem externa (margem da div) e Padding refere-se à margem interna (dentro da div).

Se a margem tem 4 valores:

margin : 25px 50px 75px 100px;

margem superior é 25px

margem direita é 50px

margem inferior é de 75px

margem esquerda é 100px


margin : 25px 50px 75px;

margem superior é 25px

margens direita e esquerda são 50px

margem inferior é de 75px


margin : 25px 50px;

margens superior e inferior são 25px

margens direita e esquerda são 50px

Se a margem tem 1 valor:

margin : 25px;

todas as quatro margens são 25px

Banco do Brasil - TI (Escriturário) – Informática – Márcio Henecke


Outras características

• media=“speech” – usado por leitores de tela que leem a página em voz alta

• Para usar CSS diferentes posso usar identificação IDs # (utilizável apenas uma vez) ou Clas-ses (utilizáveis várias vezes dentro do programa).

• É possível utilizar <div> para segmentar partes da página. Cada div pode ser sua própria configuração CSS.

Questão discutida em aula

Código HTML da questão 9 (abaixo) discutida em aula


Questões

1. (2013 – CESGRANRIO – LIQUIGÁS – Profissional Júnior – Análise de Sistemas)

A tecnologia Cascading Style Sheet (CSS) é usada para

a) viabilizar a interoperabilidade dos serviços Web. b) prover a separação entre o conteúdo e o formato de exibição de documentos HTML. c) transformar documentos XML em páginas HTML. d) viabilizar a validação remota dos dados fornecidos por usuários de aplicações Web. e) formatar os dados a serem transmitidos para um servidor Web.

2. (2018 – FGV – Câmara de Salvador – BA – Analista de Tecnologia da Informação)

Analise o código HTML a seguir.

<!DOCTYPE html>

<html>

<head>

<style>

</style>

</head>

<body>

<h1>Título</h1>

<p>Primeiro parágrafo</p>

</body>

</html>

Para que o título seja exibido na cor azul, o código CSS inserido entre a quarta e a quinta linhas deve ser:

a) font = “blue” for h1 b) h1:color=”blue” c) h1 {color:blue} d) <h1><color>blue</color></h1> e) {h1}<color:blue>{/h1}


3. (2016 – CESGRANRIO – IBGE – Supervisor de Pesquisas – Tecnologia de Informação e Comuni-cação)

O padrão de linguagem de folhas de estilo (CSS) define a apresentação de documentos escritos em uma linguagem de marcação utilizando uma sintaxe de três partes. No estilo definido pela sintaxe body {color: green}, color é a parte que define a(o)

a) chave b) fonte c) propriedade d) seletor e) valor

4. (2014 – CESGRANRIO – CEFET-RJ – Tecnólogo – Web)

Para manter uma harmonia de cores com o projeto do site, um desenvolvedor Web deve trocar as cores padrão que indicam o estado do link. Em CSS, quais são os quatro estados possíveis para um link que podem ter suas propriedades modificadas?

a) a:link, a:visited, a:active, a:inactive b) a:link, a:visited, a:hover, a:active c) a:unvisited, a:visited, a:hover, a:click d) a:unvisited, a:visited, a:hover, a:active e) a:visited, a:hover, a:active, a:inactive

5. (2013 – CESGRANRIO – IBGE – Analista – Análise e Desenvolvimento de Aplicações)

Que linguagem foi projetada para separar o conteúdo de um documento escrito em uma linguagem de marcação, tal como HTML, dos elementos de apresentação desse documento, tais como layout, cores e fontes?

a) Ajax b) Ruby c) CSS d) JSON e) JavaScript

6. (2012 – CESGRANRIO – LIQUIGÁS – Profissional Júnior – Análise de Sistemas)

O CSS permite separar o conteúdo de uma página web do seu modo de apresentação, ou seja, o CSS é responsável pelo aspecto visual do documento. Já o conteúdo deve ser estruturado usando-se outra linguagem, denominada

a) JavaScript b) Java c) VBScript d) XHTML e) ASP



7. (2010 – CESGRANRIO – Petrobras – Analista de Sistemas Júnior – Engenharia de Software)

A página, cujo código html é apresentado acima, mostrará no navegador as letras A, B, C, D e E. Cada uma com uma cor de fonte, cor de fundo, e o texto poderá estar ou não sublinhado. Após análise do trecho de código, tem-se a seguinte relação entre o texto e sua apresentação:

a) Texto Cor Fonte Cor Fundo Sublinhado A Padão Azul(blue) Sim

b) Texto Cor Fonte Cor Fundo Sublinhado B Padão Azul(blue) Não

c) Texto Cor Fonte Cor Fundo Sublinhado C Preto (black) Vermelho (red) Sim

d) Texto Cor Fonte Cor Fundo Sublinhado D Preto (black) Vermelho (red) Não

e) Texto Cor Fonte Cor Fundo Sublinhado E Azul (blue) Verde (green) Sim

8. (2008 – CESGRANRIO – Petrobras – Analista de Sistemas Júnior – Engenharia de Software)

Analise as afirmativas a seguir, sobre CSS (Cascading Style Sheets).

I – Uma folha de estilo CSS é um documento XML, em conformidade com o esquema XML xsd:css mantido pelo consórcio W3C, o que constitui uma barreira inicial de adoção para organizações onde o layout e a programação visual dos sites e portais são mantidas por profissionais de criação ao invés de desenvolvedores.

II – O uso de folhas de estilo CSS externas, em alternativa à marcação com atributos nos tags HTML e XHTML, proporciona uma redução significativa da exigência de banda, melhorando a experiência do usuário e demandando menos recursos dos servidores do site.


III – É possível especificar folhas de estilos diferentes para diferentes mídias em que a página será utilizada, o que permite, por exemplo, que uma mesma página se apresente de forma diferente quando visualizada no browser e impressa.

IV – O termo "Cascading", que, em Português, pode ser traduzido como "Em Cascata", reflete o fato de que, durante a aplicação de estilos a um documento, os tags que satisfazem a mais de um seletor receberão apenas os atributos de estilo do seletor especificado por último, ignorando todos os atributos de seletores anteriores.

Estão corretas APENAS as afirmativas

a) I e IIb) I e IIIc) II e IIId) II e IVe) III e IV

9. (2006 – CESGRANRIO – DNPM – Técnico Administrativo – Informática)

O conteúdo integral de um arquivo é apresentado abaixo.

A { color: white; background-color: red}

P { color: green}

Esse conteúdo é do tipo:

a) PERL. b) JSP. c) PYTHON. d) PHP. e) CSS.

10. (2018 – CESPE – STM – Técnico Judiciário – Programação de Sistemas)

Julgue o item subsequente, a respeito de programação web. A propriedade font-size controla o tamanho do texto em CSS.

( ) Certo ( ) Errado

11. (2018 – CESPE – STM – Técnico Judiciário – Programação de Sistemas)

Julgue o item subsequente, a respeito de programação web. Em CSS, comentários são inseridos como na seguinte forma.

/* comentário */




12. (2018 – FCC – DPE-AM – Assistente Técnico de Defensoria – Programador)

A instrução CSS3 margin: 25px 50px 75px; significa que a margem

a) inferior tem 0px. b) direita e a esquerda têm 50px. c) superior tem 75px. d) direita tem 75px. e) esquerda tem 25px.

13. (2017 – CESPE – TRE-TO – Técnico Judiciário – Programação de Sistemas)

Assinale a opção que apresenta uma tag utilizada pelo CSS (cascading style sheets) para definir uma correspondência entre um documento e um recurso externo.

a) border b) head c) link d) style e) padding

14. (2017 – FCC – TST – Analista Judiciário – Análise de Sistemas)

Uma página web responsiva é aquela que se adapta automaticamente às diferentes resoluções de tela, seja de um computador, de um dispositivo móvel, de uma TV etc. Uma das formas de se conseguir uma página responsiva é referenciando diversos arquivos CSS na página, um para cada tamanho de tela. Por exemplo, para especificar um arquivo CSS chamado config.css para dispositivos com largura da janela (resolução) até 500 pixels utiliza-se a instrução

a) <@import url("estilo.css") type="@media only screen up to 500px”> b) <link rel="stylesheet" type="@media only screen<=500px" href="config.css"> c) <style media="screen<=500px"> @import url("estilo.css"); </style> d) <link type="text/css" rule="max-screen:500px" href="config.css"> e) <link rel="stylesheet" media="only screen and (max-width: 500px)" href="config.css">

15. (2017 – FCC – TST – Técnico Judiciário – Programação)

Um Programador está criando uma página web e deseja utilizar uma instrução CSS3 para colocar todos os campos do tipo texto com fundo vermelho. A instrução que ele deverá utilizar é

a) input('type=text'){background-color:red} b) input['text']{background-color:red} c) input{type('text') background-color:red} d) input:text{background-color:red} e) input[type=text]{background-color:red}

16. (2017 – CESPE – TRT – 7ª Região (CE) – Técnico Judiciário – Tecnologia da Informação)

Entre os possíveis métodos de aplicar CSS a um documento HTML, o que importa maior flexibilidade e otimização na manutenção é a aplicação


a) interna, com uso da tag <style>. b) externa, com uso de folha de estilo. c) combinada de in-line e interna. d) in-line, com uso do atributo style.

17. (2017 – IBFC – TJ-PE – Analista Judiciário – Analista de Sistemas)

Ao analisar o trecho do código CSS (Cascading Style Sheets) abaixo detectou-se erros.

font-family: Arial, Verdana, sans-serif:

background-color: #FFF:

margin: 5px 10px:

Assinale, das alternativas abaixo, a única que identifica corretamente os erros detectados:

a) Na declaração font-family somente pode ser declarado uma única fonte b) Não existe a declaração background-color c) Cada declaração deve ser separada por ponto e vírgula d) O código hexadecimal apresentado no código é indefinido e) Na declaração margin somente pode ser declarado um único valor

18. (2017 – CESPE – TRE-BA – Técnico Judiciário – Programação de Sistemas)

Assinale a opção correta a respeito do CSS (cascading style sheets).

a) O comando <CSS src=”estilo.css”/> indica o caminho para a obtenção do arquivo CSS.b) Em um arquivo CSS, é proibido o uso de classes e indicadores. c) Com o CSS, é possível mudar rapidamente a formatação de várias páginas HTML.d) Para a utilização de recursos CSS, deve-se criar um arquivo e referenciá-lo sempre que

necessário, não sendo possível utilizar comandos CSS diretamente dentro da página HTML.e) Enquanto o HTML formata o conteúdo de uma página, o CSS descreve esse conteúdo.

19. (2017 – Quadrix – CFO-DF – Analista de Desenvolvimento de Sistema de Informação)

Com relação à interface web Ajax e à linguagem de estilos CSS, julgue o próximo item. A única forma de anexar um CSS a uma página é inserindo, dentro dela, o código CSS.


20. (2017 – Quadrix – CFO-DF – Analista de Desenvolvimento de Sistema de Informação)

Com relação à interface web Ajax e à linguagem de estilos CSS, julgue o próximo item. A possibilidade de realizar o agrupamento dos seletores que possuam as mesmas declarações constitui uma vantagem do CSS.


Gabarito: 1. B 2. C 3. C 4. B 5. C 6. D 7. C 8. C 9. E 10. Certo 11. Certo 12. B 13. C 14. E 15. E 16. B 17. C 18. C 19. Errado 20. Certo

Informática – Parte 21 Prof. Márcio Hunecke · Google Chrome, Opera, Internet Explorer 9,...

Documents

Transcript of Informática – Parte 21 Prof. Márcio Hunecke · Google Chrome, Opera, Internet Explorer 9,...