Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

lucasgurb

html5shiv :) :(

Por , em Desenvolvimento frontend

Recommended Posts

lucasgurb    0

lucasgurb
Postado

Olá pessoal,

Não sou profissional no assunto... mas preciso de ajuda para resolver um layout com o qual estou aprendendo bastante.

Já li alguns posts aqui sobre o assunto e minha dúvida permanece.

Agradeço se algum de vocês tiver paciência em me ajudar.

 

Apliquei um efeito de sombreamento text-shadow:

p { color:white;
text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em blue;

}

 

Testei a página no FireFox 26.0, funcionou e também no IE8, onde não funcionou.

Posso resolver meu problema de visibilidade do texto, diminuindo a Div onde esta o texto, jogando o texto para baixo com um simples <br/>, especificando margens, etc..

Mas desta forma não aprenderia com meu erro... apenas acharia uma alternativa para contorná-lo.

 

Aqui vai a dúvida....

Coloquei no <head> o seguinte código:

<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

Procurei colocar diretamente o arquivo html5shiv.js e mudei o código para

 

<!--[if lt IE 9]>
<script src="../js/html5shiv.js"></script>
<![endif]-->

 

Mas também não funcionou...

 

Posso aplicar este efeito para que seja visto também por navegadores IE?

 

 

O código está em:

 

http://www.magicolucas.com.br/html/shows-content5.html

 

 

 

Porém segue abaixo também:

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" dir="ltr" id="html" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content= "text/html; charset=utf-8" />
<title>
Illusionist Magician Lucas Gurbanov Shows
</title>

<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<style type="text/css">
/*<![CDATA[*/
<!--
body {
background-color: #FFF;
background-image: url(../images/bg-shows.jpg);
background-repeat: no-repeat;
background-attachment:fixed;

}
div.conteudoshows {
max-width:500px;
min-height:110px;
font-family: "Arial Black", Gadget, sans-serif;
font-size: 12px;
text-align: justify;
left:10%;
}
div.conteudoshows2 {
max-width:500px;
min-height:110px;
font-family: "Arial Black", Gadget, sans-serif;
font-size: 12px;
text-align: justify;
left:10%;
}
div.conteudoshows3 {
max-width:500px;
min-height:110px;
font-family: "Arial Black", Gadget, sans-serif;
font-size: 12px;
text-align: justify;

top:0%;
left:10%;


}
span.primeiro{

font-size: 10px;
right: auto;
margin-left: 20em;
color: #FFFFFF;
font-style: bold;
}
span.segundo{
font-size: 10px;
right: auto;
color: #000;
font-style: normal;
}
span.terceiro{
font-size: 14px;
right: auto;
color: #000;
font-style: normal;
margin-left: 15em;
}

a:link {text-decoration: none;
color:#FFFFFF;
}
a:hover {text-decoration: underline;
color: #FF0000;
}
a:visited {text-decoration: none;
color:#FFFFFF;
}
a:active {text-decoration: none;
color:#FFFFFF;
}
img {
float:left;
margin:0 20px 10px 0;
}
p { color:white;
text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em

blue;

}

/*]]>*/

</style>
</head>

 

 

 

Peço desculpas pela agressão que possa parecer este código a um profissional da área... Ainda estou ajustando muita coisa como por exemplo os acentos e cedilhas no <body>.....Mas preciso realizar as correções aos poucos..... espero melhorar com a ajuda de vocês também....

 

Esta página seria a alternativa para substituir a parte central que se vê em:

http://www.magicolucas.com.br/html/ilusionista-magico-sp-shows.html

 

 

Obrigado a todos!

Lucas

 

 

 

 

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

text-shadow não funciona em ie8

 

http://caniuse.com/css-textshadow

Compartilhar este post

Link para o post
Compartilhar em outros sites

lucasgurb    0

lucasgurb
Postado

obrigado!

Pelo que diz no site posso usar "the non-standard "dropshadow" or "glow" filters."

 

 

correto?!

alguma dica para aplicar algum efeito parecido no IE além desta acima?

 

Abraços!

Compartilhar este post

Link para o post
Compartilhar em outros sites

xanburzum    169

xanburzum
Postado

lguns exemplos:

.shadow1 { color: black; text-shadow: 2px 2px; }
text-shadow1.jpg
.shadow2 { color: black; text-shadow: #87CEEB 1px 3px; }
text-shadow2.jpg
.shadow3 {color: black;text-shadow: 1px 3px 3px rgba(135, 206, 235, 1); }
text-shadow3.jpg
.shadow4 { color: black; text-shadow: skyblue 0px 0px 0px 4px; }
text-shadow4.jpg
.shadow4_nospread { color: black; text-shadow: skyblue 0px 2px, skyblue 2px 0px, skyblue -2px 0px, skyblue 0px -2px, skyblue -1.4px -1.4px, skyblue 1.4px 1.4px, skyblue 1.4px -1.4px, skyblue -1.4px 1.4px; }
text-shadow5.jpg
.shadow5 { text-shadow: 5px 5px 2px -2px #9966CC; }
text-shadow6.jpg
.shadow6 { text-shadow: rgba(255, 255, 255, .5) 1px 1px, yellow 2px 3px, rgba(255, 153, 0, .7) 3px 6px, rgba(255, 0, 0, .5) 4px 8px; }
text-shadow7.jpg

Esses são alguns exemplos da implementação do text-shadow com Internet Explorer 10

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito