Buscar

AV1 Sobre HTML5 e CSS responde



Continue navegando


Prévia do material em texto

Sobre HTML5 e CSS responde: 
a) Como é possível associar um campo criado pelo “Input” a um rótulo criado pelo elemento “Label”? Dê exemplo. 
A)Para essa utilização é necessário que exista um atributo “id” que será utilizado como identificação no formulário.
B)Uma das novidades nesse tema é que com a atualização de atributos de algumas tags como <input>: type, pattern e require não se faz necessário a utilização do javascript.
C)Radios são opções de marcação única, em um formato de circulo geralmente utilizados em formulários.
Checkbox são quadradas e de múltipla marcação de acordo com o questionamento do formulário.
D)É uma forma de customizar dando estilo a pagina de um site, mudando fonte, borda e etc..
E)<section> é um bloco de um determinado tema, um assunto de uma parte da pagina.
<div> é utilizado para dividir algum documento dentro de um blocos por exemplo.
(2.5 Pontos)
2
Descreva o que é HTML5 e qual a diferença entre HTML5 e HTML4. Cite algumas vantagens de HTML5. No mínimo 4 linhas.
O HTML 5 é a evolução da linguagem de marcação de hipertexto. Uma de suas finalidades é permitir que os sites sejam compatíveis com qualquer navegador. Alguns pontos positivos dessa evolução são: Melhor tratamento de erros, o suporte a aplicativo web modernos, semântica melhorada, melhora no suport mobile, tratamento de áudio e vídeo, manutenção de gráficos vetoriais. Além disso o HTML 5 também pode utilizar banco de dados SQL web e cache de aplicativos, dando uma certa tranquilidade na memória RAM do usuário.
(1.5 Pontos)
3
Cria uma página com a estrutura mostrada na imagem com fundo da sua escolha. Utilize um arquivo CSS externo para a formatação.
HTML
<!DOCTYPE html>
<html>
<head>
	<title>AV 1 Aula com CSS</title>
	
	<link rel="stylesheet" type="text/css" href="Estilos AV1.css">
	</style>
</head>
<body>
	<h1>Minha tela com CSS</h1> 
	<p class="paragrafo" id="paragrafo-rosa">Parabéns, você esta assistindo aula de CSS!</p>
<div>
	<figure>
	</figure>
	</div>	
</body>
</html>
CSS
h1{
	color: red; /* Cor da letra paragrafo*/
	border: 1px solid blue; /*colocando borda 1px, estilo e cor*/
	background-color: yellow /*cor de fundo*/
	width: 300px; /*largura do paragrafo */
	height: 50px; /*altura do paragrafo */
	padding-left: 20px; /*margem esquerda */
	padding-top: 20px; /*margem de cima */
	text-align: center;
	margin:2 auto;
	font-style: arial;			
}
p{
	color: yellow; /* Cor da letra paragrafo*/
	border: 1px solid black; /*colocando borda 1px, estilo e cor*/
	background-color: black; /*cor de fundo*/
	width: 250px; /*largura do paragrafo */
	height: 100px; /*altura do paragrafo */
	padding-left: 20px; /*margem esquerda */
	padding-top: 10px; /*margem de cima */
	text-align: center;
	margin:0 auto;
	}
body{
	
	background-image: url(Maragogi.jpg); 	/*abrir imagem */
	background-repeat: no-repeat;			/*não repetir imagem */
	background-size: cover;					/*centraliar imagem do tamanho da tela */
	font-family: sans-serif;				/* fonte da letra */
	/*border: 1px solid red;*/
}
figure{
	
	color: yellow; /* Cor da letra paragrafo*/
	border: 1px solid black; /*colocando borda 1px, estilo e cor*/
	background-color: green; /*cor de fundo*/
	width: 250px; /*largura do paragrafo */
	height: 500px; /*altura do paragrafo */
	/*padding-left: 20px;*/ /*margem esquerda */
	/*padding-top: 10px;*/ /*margem de cima */
	text-align: center;
	margin:2 auto;
4
Construa uma outra pagina com nome dados_profissionais com um formulário contendo campo para digitação de nome, campos de radio para sexo, campo para areas de atuação pre-definida, um campo para upload de imagem do perfil e dois botões com nomes (Salvar e Cancelar). O campo para digitação de nome deve aceitar tipo de dados texto, ser nomeado como nome, ter tamanho visível de 30 e aceita no máximo 30 caracteres. Campo sexo deve ser do tipo radio e deve possuir masculino e feminino respetivamente. Campo área de atuação deve ter o tipo checkbox com nomes da área (Administração, Informática, Contabilidade, Direito, Pedagogia e Medicina). O campo Informática deve aparecer selecionada. Cada campo deve estar em uma linha diferente.
(2 Pontos)
5
Criar uma página com nome index que contenha um formulário para entrada de cpf, nome, e-mail, data de nascimento e contato em uma linha diferente e que tenha dois botões do tipo submit com rótulos ( Enviar sem validar e outro Validar e Enviar). Os campos cpf, nome e e-mail devem ter preenchimento obrigatório, porem, ao clicar no botão Enviar sem validar esse validação de preenchimento obrigatório deve ser ignorada. Ao clicar no botão Validar e Enviar, a validação de preenchimento obrigatório deve ser considerado.
(2 Pontos)