como lograr este efecto

[chamaco05]

Que cuando le das a la imagen, salga el video. ahi puse un ejemplo de lo que quiero lograr hacer.

http://www.battlefield.com/es/battlefield-4/featured-video

[ArturoGallegos]

eso no se hace con CSS, nunca lo he hecho pero tal vez con javascript o ajax.

[angelAparicio]

Echando un vistazo, está hecho así:

<div id="video-wrapper">
<div class="video-box">
<iframe src="http://youtube.com/...." />
</div>
</div>

Con CSS le pones la imagen a #video-wrapper como fondo y a video-box le pones display: none;

Y con javascript haces que cuando se haga click en video-wrapper se muestre video-box (display:block). Si no recuerdo mal, si el vídeo de youtube lo tienes como autoplay solo empezará a reproducirse cuando la capa en la que está se muestre.

[pzin]

Puramente con CSS sólo puedes hacerlo usando :target. Sería algo así:

Código HTML:

<a href="#contenedor">ver video</a>
<div id="contenedor">
  <div>el vídeo</div>
</div>
 

Código CSS:

div#contenedor > div {
  display: none;
}
 
div#contenedor:target > div {
  display: block;
}