Exercícios sobre CSS com Respostas
9 pág.

Exercícios sobre CSS com Respostas


DisciplinaHtml e Css46 materiais951 seguidores
Pré-visualização1 página
APLICAÇÕES PARA A WEB \u2013 EXERCÍCIOS SOBRE CSS
Crie os seletores usando CSS (desconsiderar bordas e cores) e na sequencia faça uso de HTML para incorporá-los na página conforme a representação a seguir:
RESPOSTA:
CSS
#A, #B { width: 100px; height: 100px }
HTML
<div id=&quot;A&quot;>A</div>
<div id=&quot;B&quot;>B</div>
Crie os seletores usando CSS (desconsiderar bordas e cores) e na sequencia faça uso de HTML para incorporá-los na página conforme a representação a seguir:
RESPOSTA:
CSS
#A , #B , #C , #D{
	width: 100px;
	height: 100px;
}
#esq { 
	float: left
}
#dir { 
	float: right
}
HTML
<div id=&quot;esq&quot;>
 <div id=&quot;A&quot;>A</div>
 <div id=&quot;B&quot;>B</div>
</div>
<div id=&quot;dir&quot;>
 <div id=&quot;C&quot;>C</div>
 <div id=&quot;D&quot;>D</div>
</div>
Crie os seletores usando CSS (desconsiderar bordas e cores) e na sequencia faça uso de HTML para incorporá-los na página conforme a representação a seguir:
RESPOSTA
CSS
#A {
	width: 100%;
	height: 100px
}
#B , #C {
	width: 50%;
	height: 200px; 
	float:left
}
HTML
 <div id=&quot;A&quot;>A</div>
 <div id=&quot;B&quot;>B</div>
 <div id=&quot;C&quot;>C</div>
Crie os seletores usando CSS (desconsiderar bordas e cores) e na sequencia faça uso de HTML para incorporá-los na página conforme a representação a seguir:
RESPOSTA
CSS
#A , #B , #C , #D {
	width: 100px;
	height: 100px;
	position:absolute
}
#A {
	top: 100px;
	left: 50px;
	z-index: 2
}
#B {
	top: 150px;
	left: 100px;
	z-index: 1
}
#C {
	top: 100px;
	right: 50px;
	z-index: 1
}
#D {
	top: 150px;
	right: 100px;
	z-index: 2
}
HTML
 <div id=&quot;A&quot;>A</div>
 <div id=&quot;B&quot;>B</div>
 <div id=&quot;C&quot;>C</div>
 <div id=&quot;D&quot;>D</div>
Crie os seletores usando CSS (desconsiderar bordas e cores) e na sequencia faça uso de HTML para incorporá-los na página conforme a representação a seguir:
RESPOSTA:
CSS 
#A , #B, #C, #D {
	width: 100px;
	height: 100px;
	position:absolute
	
}
#A {
	top: 100px;
	left: 50px
}
#B {
	top: 150px;
	left: 50px;
}
#C {
	top: 100px;
	right: 50px;
}
#D {
	top: 100px;
	right: 100px;
}
HTML
 <div id=&quot;A&quot;>A</div>
 <div id=&quot;B&quot;>B</div>
 <div id=&quot;C&quot;>C</div>
 <div id=&quot;D&quot;>D</div>
Crie os seletores usando CSS (desconsiderar bordas e cores) e na sequencia faça uso de HTML para incorporá-los na página conforme a representação a seguir:
R ESPOSTA:
CSS 
#A , #B, #C, #D {
	width: 100px;
	height: 100px;
	position:absolute
	
}
#A {
	top: 100px;
	left: 50px
}
#B {
	top: 150px;
	left: 50px;
}
#C {
	top: 100px;
	right: 50px;
}
#D {
	top: 100px;
	right: 100px;
}
#E {
	width: 100px; 
height: 100px;
margin: 0 auto;
margin-top: 100px
}
HTML
 <div id=&quot;A&quot;>A</div>
 <div id=&quot;B&quot;>B</div>
 <div id=&quot;C&quot;>C</div>
 <div id=&quot;D&quot;>D</div>
 <div id=&quot;E&quot;>E</div>
Crie os seletores usando CSS (desconsiderar bordas e cores) e na sequencia faça uso de HTML para incorporá-los na página conforme a representação a seguir:
RESPOSTA:
#A {
	width: 350px;
	height: 350px;
}
#B {
	width: 200px;
	height: 200px;
}
#C {
	width: 100px;
	height: 100px;
	float:right; 
	margin-top:100px;
}
#D {
	width: 100px;
	height: 100px;
	float: right;
}
HTML
 <div id=&quot;A&quot;>A
	 <div id=&quot;B&quot;>B
 	<div id=&quot;C&quot;>C</div>
 </div>
 <div id=&quot;D&quot;>D</div>
 </div>