Me gustaría dibujar una línea punteada, verticalmente en el centro de mi página, "escondida" debajo de cualquier cuadro de contenido en el camino ... ¿Hay alguna técnica para hacer esto en CSS, o tendré que usar un repitiendo imagen?¿Cómo dibujar una línea vertical punteada en el centro de la página usando CSS?
Para la línea de puntos, lo usaría:
.vertical_dotted_line
{
border-left: 1px dotted black;
height: 100px;
}
<div class="vertical_dotted_line"></div>
y para que sea under otros elementos que necesita para jugar con el z-index de su div línea de puntos y los otros divs (deben tener un valor bigged de z-index)
debería ser simplemente negro en lugar de #black –
@CarlAmbroselli sí de hecho :) –
Esto se puede hacer repitiendo la imagen o CSS dependiendo del tipo de punto que desee ya que CSS tiene solo algunos tipos o incluso un solo punto normal.
Con CSS puede hacerlo haciendo el borde hacia la izquierda o hacia la derecha.
Por ejemplo
<div class="one"></div>
<div class="tow"></div>
CSS
.one{
width: 50%;
border-right: 1px dotted red;
}
y con la imagen
body{
background-image: url("dotted.png") repeat-y center top;
}
Esto le da puntos: http://jsfiddle.net/NBMRp/
body:after {
content:"";
position: absolute;
z-index: -1;
top: 0;
bottom: 0;
left: 50%;
border-left: 2px dotted #444; /*change these values to suit your liking*/
}
Simplemente no son tan bonitas.
Buena solución sin solicitud de imagen – Scrimothy
Crear una imagen PNG en todo el 1px en Photoshop con el patrón deseado, a continuación, establecer como fondo (o una de las múltiples imágenes de fondo en CSS 3) del elemento <body>, así:
body {
background-image: url("dottedLine.png") repeat-y center top;
}
Usted Probablemente pueda hacer esto sin archivos de imagen usando un URI data: o creando un gradiente CSS3 de 2px de alto que se repite.
Si usted quiere las líneas deben extenderse hacia fuera de la altura del div -
.dashed-lines:after {
content:"";
position: absolute;
z-index: -1;
top: -50px;
bottom: -50px;
left: 50%;
border-left: 2px dotted #ce9b3a;
}
¿Cómo serían los puntos tienen que ser? – banzomaikaka