Cómo darle forma a tu contenido HTML con CSS

Antoniio1 Seguir

Gamma
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
11 Ago 2018
Mensajes
295
Hola, buenas. Hice una estructura con html para mostrar contenido, la hice así:
HTML:
<img src="https://www.google.se/images/google_80wht.gif" alt="Mundo Magico Logo">
<h2>CUIDADOS EVENTUALES</h2>
<p>El cuidado eventual consiste en apoyarse con el cuidado de tus niños por horas, desde 1 hora  de servicio, hasta todas las horas que necesites. El servicio está disponible para apoyarte de lunes a domingo las 24 horas.</p>
<p>Nuestra prioridad es el cuidado y diversión de tu pequeño, por lo cual, te ayudamos con todas las tareas necesarias para lograr un excelente cuidado, desde:</p>
<ul>
    <li>Cuidado de niños de recién nacidos a 10 años.</li>
    <li>Cámara web en vivo (desde el celular).</li>
    <li>Estimulación temprana para bebes.</li>
    <li>Juegos adecuados a la edad.</li>
    <li>Preparación de alimentos.</li>
    <li>Duchas.</li>
    <li>llevarlos a dormir.</li>
    <li>Jugar con ellos .</li>
    <li>Apoyo con tareas escolares.</li>
    <li>Darles medicamentos (si lo necesita) .</li>
</ul>
<p>Para lograr una excelente conexión con los niños,las nanny están capacitadas con las herramientas necesarias para adaptarse a las necesidades de cada niño, como su personalidad, gustos y el entorno que la rodea.</p>
<p>La confianza es algo fundamental, es por eso que te brindamos la experiencia de monitorear tu servicio en vivo desde tu celular, estando atenta de cada detalle y logro de tu hijo, desde donde estés podrás disfrutar de esta experiencia, incluso si viajas! </p>
<p>¡No esperes más, para disfrutar de la experiencia de contar con una persona ideal para tus niños!</p>

Me da este resultado:
prueba.png


Cómo puedo usar css para dejarla así?
eventuales78.jpg


Espero alguien pueda apoyar, gracias de antemano.

Saludos!
 

emanuel12239

Gamma
Verificación en dos pasos activada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
9 Ago 2019
Mensajes
255
no puede dar la url de la imagen q queres como quede
usa un tabla busca en google table html
 

Antoniio1

Gamma
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
11 Ago 2018
Mensajes
295
Busqué en google eso y me aparecen tablas en html
 

Pedro Urbina

Alfa
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
20 Oct 2019
Mensajes
23
Para hacer lo que tu quieres debes simplemente crear los estilos, y el HTML no esta maquetado, es decir te falta delimitar las diferentes secciones. por ejemplo todo lo puede poner dentro de un contenedor <div> luego el h2 que sea otros <div> y el contenido otro.

al <div> del h2 le creas una clase ejemplo .titulo, quedaria algo asi como: <div class=titulo> y te irías a la hoja de estilo y añades la propiendas que se ajusten. esto es para darte una idea. Pero si no sabes nada de CSS lo mejor es busques un curso básico en youtube hay muchos gratis y que te darán las nociones para empezar
 

Antoniio1

Gamma
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
11 Ago 2018
Mensajes
295
Sí, por ejemplo, hice esta parte:
HTML:
<h2 class="titulo">CUIDADOS EVENTUALES</h2>

Y el css lo dejé así:
h2.png


El resultado del fondo y del titulo debería cambiar pero sigue viéndose así:
h22.png


Yo añado el html desde una bd con esta línea:
HTML:
<p [innerHTML]="product_description.product_description"></p>
 

Adjuntos

  • css.png
    css.png
    14,5 KB · Visitas: 8

spot

Gamma
Verificación en dos pasos desactivada
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
17 Jul 2013
Mensajes
400
Pasa la url haber en que puedo ayudar. por inbox o aquí.
 

Antoniio1

Gamma
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
11 Ago 2018
Mensajes
295

EspErpENto

Mi
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
16 Feb 2013
Mensajes
3.309

Primero va la clase y luego el elemento.
Prueba con:

.titulo h2{
color: red;
}

Aquí te falta el punto antes de las clases:
.ion-header .ion-title{
text-align: center;
}

y para el body, primero coloca todo el texto entre etiquetas body

El tema de la lista es que debes coger unos bullets.

Suerte y comenta.
 

¡Regístrate y comienza a ganar!

Beneficios

  • Gana dinero por participar
  • Gana dinero por recomendarnos
  • Descubre ofertas de empleo diariamente
  • Negocios seguros
  • ¡Información premium y más!

Acceder

¿Ya tienes una cuenta? Accede aquí

Arriba