html/columnas.html at master · SergioGeeK7/html · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<!doctype html>
<html lang="en">
<head>
	<style type='text/css'>

	h1{
	text-align: center;
	}

	h2{
		text-align: center;

	}

	.articulo{

	/* organizar por columnas*/
		-webkit-column-count:3 ;
		-moz-column-count:3 ;
		-ms-column-count:3 ;
		-o-column-count:3 ;
		column-count:3 ;

		/* espaciado entre cada columna*/
	-webkit-column-gap:20px ;
	-moz-column-gap:20px ;

	/* linea separadora entre las columnas*/
	column-rule:4px solid black;    // dotted dashed double
	-moz-column-rule:4px solid black;
	-webkit-column-rule:1px dotted gray;


	}

	</style>
	<meta charset="UTF-8">
	<title>Columnas Dentro de un texto</title>
</head>
<body>

<h1>titulo de el articulo</h1>
<h2>subtitulo</h2>
<div class="articulo">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tenetur, ea ipsam aliquid dolore voluptates incidunt consequatur! <img src="imagen.png" alt="" width='100' heigth='100'>Ipsam eius perspiciatis maiores dolorum quo omnis impedit dolorem dicta. Assumenda optio eius praesentium.</div>
</body>
</html>