Ejemplo 1: diseño de dos columnas html css
DOCTYPEhtml><html><head><metaname="viewport"content="width=device-width, initial-scale=1"/><style>bodyfont-family: Arial;color:white;.left,.rightheight:50%;width:50%;position: fixed;overflow-x: hidden;padding-top:20px;.leftleft:0;background-color:rgb(36,0,95);.rightright:0;background-color:rgb(56,1,44);.centeredposition: absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align: center;.centered imgwidth:150px;border-radius:50%;style>head><body><h1style="color:black;">Two column layout grid exampleh1><divclass="left"><h1>Some random text on the lefth1>div><divclass="right"><h1>Some random text on the righth1>div>body>html>
Ejemplo 2: cómo hacer una lista de dos columnas en html
<code>ul
width:760px;
margin-bottom:20px;
overflow:hidden;
border-top:1px solid #ccc;
li
line-height:1.5em;
border-bottom:1px solid #ccc;
float:left;
display:inline;
#double li width:50%; <spanclass="code-comment">/* 2 col */span>
#triple li width:33.333%; <spanclass="code-comment">/* 3 col */span>
#quad li width:25%; <spanclass="code-comment">/* 4 col */span>
#six li width:16.666%; <spanclass="code-comment">/* 6 col */span>code>
valoraciones y comentarios
Si haces scroll puedes encontrar las anotaciones de otros usuarios, tú todavía tienes la habilidad mostrar el tuyo si lo deseas.
¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)