Não consegui colocar alt dentro das img class, ele aparece na tela escrito, e no caso das caixas ele faz a imagem desaparecer, como faço?
body {
line-height: 1.5;
font-family:"Crimson Text","Times New Roman", serif;
background-color: #F2FFFC;
font-size: 120%;
}
main div {
padding: 30px 0;
width: 720px;
margin:auto ;
}
h1, h2 {
font-size: 30px;
font-family: "Open Sans Condensed" ,"Arial", sans-serif;
}
.titulo-principal{
font-size: 60px;
border-bottom: 10px black solid;
padding: 25px;
text-align: center;
background-color: #851944;
color: #FFF;
text-transform: uppercase;
}
p {
margin: 20px 20px;
text-align:justify;
}
aside{
background-color: #3C1D3D;
color: #F2FFFC;
}
footer{
color: #F2FFFC;
}
nav a {
color: #F2FFFC;
text-transform: lowercase;
}
main a{
color: #851944;
}
aside a{
color: inherit;
font-family: "Open Sans Condensed", sans-serif;
}
aside, footer {
padding: 20px;
}
aside {
text-align: center;
}
aside h1{
font-size: 30px;
margin-bottom: 25px;
}
strong {
font-weight: bold;
}
em {
font-style: italic;
}
.icones-sociais li {
display:inline-block;
}
.icones-sociais a {
width:40px;
height:40px;
text-indent:-9999px;
display: block;
}
#rodape-pagina {
background-color: #000;
color: #F2FFFC;
padding: 20px;
}
.rodape-inicial{
border:2px solid #ccc;
}
.leia-mais {
margin: 15px;
font-size: 20px;
padding: 5px;
display: inline-block;
text-align: center;
background-color: #E6E7E8;
}
.github{
background-image:url(../img/github.png);
}
.twitter{
background-image:url(../img/twitter.png);
}
.linkedin{
background-image:url(../img/linkedin.png);
}
h2{
clear:both;
}
.foto-eu, aside {
float: right;
box-sizing: border-box;
border-bottom: 12px solid black;
border-left: 12px solid black;
}
footer {
clear: both;
position: fixed;
bottom: 0;
width: 100%
}
main{
float: left;
width: 85%;
padding-bottom: 100px;
}
.foto-eu{
background-image: url(../img/eu.jpg);
position: absolute;
top: 0;
right: 0;
height: 310px;
width: 310px;
}
aside{
width: 15%;
position: relative;
top: 310px;
}
blockquote{
border: 8px solid black;
background-color: #FAFFFC;
padding: 16px;
margin: 16px;
width: 320px;
height: 280px;
float: left;
}
.quadro-2{
float: left;
width: 320px;
height: 280px;
padding: 16px;
margin: 16px;
}
.quadro-3{
float: left;
width: 320px;
height: 280px;
padding: 16px;
margin: 16px;
}
.quadro-4{
float:left;
width: 320px;
height: 280px;
padding: 16px;
margin: 16px;
}
.foto-bmw{
background-image: url(../img/bmw.png);
height: 150px;
width: 260px;
}
.foto-uol{
background-image: url(../img/uol.png);
height: 150px;
width: 260px;
}
.foto-ibm{
background-image: url(../img/ibm.png);
height: 150px;
width: 260px;
}
.foto-g1{
background-image: url(../img/g1.png);
height: 150px;
width: 260px;
}