Cómo crear línea divisoria de texto en Wordpress como imagen

designroman · 23 Ene 2023

Buenas Noches, les hago una consulta como puedo lograr poner una linea tipo tabla, de separacion de texto, en wordpress igual a la de esta foto? Muchas Gracias

SeoLógica · 23 Ene 2023

Prueba con esto, espero que ayude

W3Schools online HTML editor

The W3Schools online code editor allows you to edit code and view the result in your browser

www.w3schools.com

Cicklow · 23 Ene 2023

Es una tabla normal solo que tiene el borde superior, en el ejemplo que te dieron antes edita el css para que las filas tengan el borde superior nada mas.

designroman · 23 Ene 2023

Cicklow dijo:
Es una tabla normal solo que tiene el borde superior, en el ejemplo que te dieron antes edita el css para que las filas tengan el borde superior nada mas.

me podrias orientar como realizo una tabla asi? gracias

Cicklow · 23 Ene 2023

designroman dijo:
me podrias orientar como realizo una tabla asi? gracias

HTML:

<!DOCTYPE html>
<html>
<head>
<style>
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
  border: none;
}

td, th {
 
  border-top: solid 1px #ddd;
  text-align: left;
  padding: 8px;
}
</style>
</head>
<body>

<h2>HTML Table</h2>

<table>
  <tr>
    <th>Company</th>
    <th>Contact</th>
    <th>Country</th>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>Mexico</td>
  </tr>
  <tr>
    <td>Ernst Handel</td>
    <td>Roland Mendel</td>
    <td>Austria</td>
  </tr>
  <tr>
    <td>Island Trading</td>
    <td>Helen Bennett</td>
    <td>UK</td>
  </tr>
  <tr>
    <td>Laughing Bacchus Winecellars</td>
    <td>Yoshi Tannamuri</td>
    <td>Canada</td>
  </tr>
  <tr>
    <td>Magazzini Alimentari Riuniti</td>
    <td>Giovanni Rovelli</td>
    <td>Italy</td>
  </tr>
</table>

</body>
</html>

asi te quedaria el code... solo es un borde superior gris clarito. pone ese code en la url que te dieron antes y dale al boton run...asi ves como queda... dsp solo te queda aprender a colocar css en tu wp y armar la tabla en el post.

designroman · 23 Ene 2023

Cicklow dijo:

HTML:

<!DOCTYPE html>
<html>
<head>
<style>
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
  border: none;
}

td, th {
 
  border-top: solid 1px #ddd;
  text-align: left;
  padding: 8px;
}
</style>
</head>
<body>

<h2>HTML Table</h2>

<table>
  <tr>
    <th>Company</th>
    <th>Contact</th>
    <th>Country</th>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>Mexico</td>
  </tr>
  <tr>
    <td>Ernst Handel</td>
    <td>Roland Mendel</td>
    <td>Austria</td>
  </tr>
  <tr>
    <td>Island Trading</td>
    <td>Helen Bennett</td>
    <td>UK</td>
  </tr>
  <tr>
    <td>Laughing Bacchus Winecellars</td>
    <td>Yoshi Tannamuri</td>
    <td>Canada</td>
  </tr>
  <tr>
    <td>Magazzini Alimentari Riuniti</td>
    <td>Giovanni Rovelli</td>
    <td>Italy</td>
  </tr>
</table>

</body>
</html>

asi te quedaria el code... solo es un borde superior gris clarito. pone ese code en la url que te dieron antes y dale al boton run...asi ves como queda... dsp solo te queda aprender a colocar css en tu wp y armar la tabla en el post.

Te agradesco mucho!!!

Cómo crear línea divisoria de texto en Wordpress como imagen

designroman

SeoLógica

W3Schools online HTML editor

Cicklow

designroman

Cicklow

designroman

Temas similares