📣 Seu anúncio aqui? Anuncie no ForoBeta

Conseguir efeito sublinhado largo estilo H2 de Franck Scipion

  • Autor Autor Spro
  • Data de início Data de início
Tradução em andamento: em alguns minutos este tópico estará em português. Por enquanto, o conteúdo está no original em espanhol. Ver original
S

Spro

Gamma
SEO
Muy Buenas Compañeros,

Me gusta mucho el estilo que Franck Scipion ha dado a su H2 en las entradas. De esta forma se diferencian muy bien las diferentes secciones dentro del post.
Tengo un proyecto en el que me gustaría hacer algo parecido, ya que cada entrada irá dividida en diferentes apartados diferentes.
¿Sabéis cómo se puede conseguir un efecto similar?
Os dejo una captura de lo que me refiero. Visualmente parece un subrayado de ancho completo de entrada
Captura.webp

Muchas Gracias :encouragement:
 
Foi útil? Participe da conversa

Com sua conta grátis você pode responder, mandar mensagem privada ao autor e comprar com Saldo retido: o pagamento é liberado quando você recebe o combinado.

Continuar com o Google Criar conta com e-mail
Leva 30 segundos · você volta a este tópico ao terminar
Botón derecho sobre el H2 > inspeccionar elemento. Copias el CSS y lo pegas en el tuyo :encouragement: .

Si no podés posteá el enlace que te lo extraigo.


Googlee un poco y pude encontrar el sitio que decias. Colocá este código css en tu plantilla (al final de todo)

.single-post h2, .entry-content h2 {
border-bottom: 3px solid #fd904d;
color: #e86515;
font-size: 1.2em;
font-weight: normal;
margin: 60px 0 50px;
padding-bottom: 15px;
text-align: center;
}
 
Última edição:
Muchísimas Gracias. La has clavado :encouragement:

Lo único es que también se visualiza esa línea debajo del título de la web. ¿Podrías decirme como quitarlo?

Muchas Gracias de nuevo

Un Saludo
 
Elimina esto: border-bottom: 3px solid #fd904d;

- - - Actualizado - - -

Spro disse:
Muchísimas Gracias. La has clavado :encouragement:

Lo único es que también se visualiza esa línea debajo del título de la web. ¿Podrías decirme como quitarlo?

Muchas Gracias de nuevo

Un Saludo
Clique para expandir...
Elimina esto:
border-bottom: 3px solid #fd904d;
 
Holaa pues como dijo tonchitoZ solo tienes que agregar en tu estyle.css las siguientes lineas

.single-post h2, .entry-content h2{
color:#E86515;
font-size:1.2em;
margin:60px 0 50px;
font-weight:normal;
padding-bottom:15px;
text-align:center;
border-bottom:3px solid #fd904d;
}

Ya lo probé y me sale igual en los h2 de mi blog (después lo elimine) si me pasas la url de tu blog para ver porque te sale tambien en el titulo ya que el código solo modifica los h2 de los post ahora bien quizás sea que tus títulos los tengas en h2 y no en h1 como deberia ser te recomiendo cheques esa parte de tu theme.
 
eswal200 disse:
Holaa pues como dijo tonchitoZ solo tienes que agregar en tu estyle.css las siguientes lineas

.single-post h2, .entry-content h2{
color:#E86515;
font-size:1.2em;
margin:60px 0 50px;
font-weight:normal;
padding-bottom:15px;
text-align:center;
border-bottom:3px solid #fd904d;
}

Ya lo probé y me sale igual en los h2 de mi blog (después lo elimine) si me pasas la url de tu blog para ver porque te sale tambien en el titulo ya que el código solo modifica los h2 de los post ahora bien quizás sea que tus títulos los tengas en h2 y no en h1 como deberia ser te recomiendo cheques esa parte de tu theme.
Clique para expandir...

Efectivamente el Título de la web me aparece como H2 y por eso muestra también ese estilo. ¿Qué formato debería ponerle para que no muestre dicho estilo?

Muchas gracias por la ayuda, de verdad 😛7:
 
Lo que sucede es que agregas el estilo en general a todos los H2, por eso se muestra tu titulo con el estilo sobreescrito. Si pudieras mostrarme tu web, para que yo vea el código y te diga exactamente la regla CSS que debes aplicar.

Aunque lo mas rudimentario y que no recomiendo hacer, porque es una mala práctica. Es envolver en un div con una clase especial a tus post y aplicar tal estilo a dicha clase.
 
Última edição:
Spro disse:
Efectivamente el Título de la web me aparece como H2 y por eso muestra también ese estilo. ¿Qué formato debería ponerle para que no muestre dicho estilo?

Muchas gracias por la ayuda, de verdad 😛7:
Clique para expandir...

pues deberia ser algo haci

h1 = solo un titulo, en este caso se utiliza en el titlo del articulo una sola vez
h2 y h3 = se utilizan para subtitulos
y pues bueno hasta hayi te puedo ayudar pues si nos proporcionas la url de tu web seria mas facil y rapido ayuderte
 
Você precisa estar logado ou cadastrado para responder aqui.
Voltar
Topo