comment obtenir cette css3 effet d'ombre?

Je suis en train de voir si c'est possible de réaliser ce genre d'ombre à l'aide de pure css3:

comment obtenir cette css3 effet d'ombre?

J'ai vite raillé ce dans photoshop. Je suis à la recherche pour que la courbe effet d'ombre. Je sais que c'est possible d'obtenir droit des effets d'ombre. J'ai essayé de regarder sur google, je ne sais même pas comment l'appeler que les courbes de l'ombre. Je ne pouvais pas trouver n'importe où qui dit que ce n'est pas possible. Ne pourrais pas le trouver n'importe où qui dit que c'EST possible que ce soit.

si css3 n'est pas le cas, je suis prêt à utiliser jQuery.

toute aide, beaucoup apprécié.
merci.

edit: Le plus proche que j'ai eu à réaliser toute sorte d'ombre juste avec css3 est-ce: http://jsfiddle.net/tVt4w/

Oui, c'est possible. Voir: nicolasgallagher.com/css-drop-shadows-without-images/demo matthamm.com/box-shadow-curl.html Vous pouvez facilement adapter ces techniques pour faire de l'ombre vous montrer, même si personnellement je pense que le tien est un peu plus haut. Tout à fait possible.
Salut Lea, je suis en train de travailler sur un portefeuille personnel, donc, il est bon d'être un peu plus haut 🙂 le droit?
Je ne crois pas, désolé. Une bonne conception est subtile.

OriginalL'auteur LocustHorde | 2011-05-31

  1. 21

    Au début, je ne pensais pas que c'était possible. Ensuite, j'ai trouvé cette page qui montre quelques beaux exemples en pur css.

    Chouette.

    Voir le page de démonstration pour avoir une idée de ce qui peut être réalisé.

    Nice. Bien sûr, rien de tout cela fonctionne dans IE (y compris 9.) Soupir.
    Il ne fonctionne pas dans IE.
    Salut, j'ai trouvé une autre page de liste des le premier exemple à partir de votre lien, mais pas la totalité de la chose. Je suis la vérification d'autres styles à partir de votre lien, vous permettra de savoir comment ça se passe un peu, merci beaucoup.
    Levé coins!! c'est exactement ce que je voulais, va se mêler avec elle jusqu'à ce que je "l'ascenseur" les coins à mon goût, merci beaucoup! maintenant pour tout le monde préféré de petit diable c'est à dire, avez-vous des suggestions s'il vous plaît?
    oh, j'ai trouvé un post sur l'obtention des choses à travailler dans IE8 (il y avait beaucoup de ms-fitler et quelques ridicule options)

    OriginalL'auteur stefgosselin

  2. 2

    HTML et CSS

    L'ombre s'adapte automatiquement à la largeur de l'image.

    À l'aide d'une image PNG, ce qui peut être fait:

    (non exhaustive d'testé pour la compatibilité, mais il fonctionne dans le dernier FF, Safari et Chrome)

    <style type="text/css" media="all">
.shadow {
    position:relative;
    width:auto;
    padding:0;
    margin:0;
}
.shadow:before,
.shadow:after {
    content:"";
    position:absolute; 
    z-index:-1;
}
.arch01:after {
    position:absolute;
    padding:0; margin:0;
    height:34px;
    width:100%;
    bottom:-30px;
    left:0px; right:0px;
    background-image: url('arch_01.png');
    background-size:100% 100%;
    background-position:left top;
}
</style>


<span class="shadow arch01">
    <img src="photo.jpg" width="500px" height="250px">
</span>
    Non, désolé... Ce n'est pas "html et css uniquement" si vous utilisez une image, est-il?
    Puisque les images font partie de la première mise en œuvre de HTML en 1993, alors non, je suis en désaccord. Les Images sont plus fondamentaux que les css lui-même. C'est très simplifié, mais si pure core, la compatibilité est votre objectif, alors la meilleure solution est de vidage de la css, de revenir aux tables et machines à sous dans une image de l'ombre dans une cellule de tableau, sous l'image ou la zone que vous souhaitez avoir l'ombre d'automne.

    OriginalL'auteur unidentified-1