Directorio de artigos
enWordPressNa edición de artigos, hai un botón común "bloquear citas"▼
Cando se usa, engade aMarcador para invocar algunha declaración citada ou resaltar.
Que significa blockquote?
O seguinte éChen WeiliangEstilo de cita para blogs:
A etiqueta XHTML blockquote é un elemento moi útil (se está infrautilizado).Semanticamente, o blockquote debe usarse sempre que estea citando texto máis longo doutra fonte (outro orador, outro sitio web, etc.).Esta é unha forma de delimitar o texto e mostralo con outras fontes.
En canto ao estilo, podes facer todo isto con clases especiais sobre etiquetas de parágrafo... pero iso é inútil semanticamente, non si? As comillas en bloque teñen algúns estilos por defecto.
A maioría dos navegadores introducen sangrías de texto en etiquetas blockquote, o que axuda aos usuarios a identificar o texto dalgún xeito.Pero quen pode dicir que hai que parar aí?Aquí tes como crear o estilo das túas citas en bloque con CSS.
Proba test-css.html e engade a sección css ao corpo html:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en-us"> <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Test CSS blockquote</title> </head> <blockquote> <p>The blockquote XHTML tag is a fairly useful (if somewhat underused) element. Semantically speaking, a blockquote should be used any time you’re quoting a longer piece of text from another source – another speaker, another website, whatever. It’s a way of setting the text apart, and showing that it came from some other source. Stylistically, you could accomplish all this with a special class on your paragraph tags… but that wouldn’t be as semantically useful, now, would it?<br> Blockquotes do have some styling by default. Most browsers will indent the text in a blockquote tag, which helps the user recognize that the text is different somehow. But who's to say that we need to stop there? Here are six different ways you could style your blockquotes using CSS.</p> </blockquote> </body> </html>
Como usar blockquote?
Descubriuse que algúns temas de WordPress non engaden estilos de referencia no ficheiro style.css.
Copia e pega o seguinte estilo de canto redondeado de fondo azul no ficheiro style.css do tema▼
blockquote, q {
font: bold 21px/1.5 Consolas,"Courier New","KaiTi","KaiTi_GB2312","FangSong_GB2312",SimHei,arial,Monaco,monospace;
color: #000;
margin: 1em;
margin-left: 2em;
margin-right: 2em;
padding: 3px;
max-width: 95%;
quotes: "\201C""\201D""\2018""\2019";
background: #C3F3F7;
border-radius: 20px;
}Os estilos de referencia determinan o texto do corpo (tamaño, cor), cor de fondo, espazos en branco, bordos, etc...
estilo de borde
Este estilo é relativamente sinxelo, é dicir, establece o bordo esquerdo e establece o grosor.A cor controla a cor da fonte e a cor de fondo controla a cor de fondo (ou o grupo de fondo directo).
A marxe controla a distancia ao elemento da xanela, o lado esquerdo do bordo controla o estilo do bordo esquerdo e o recheo (especialmente o lado esquerdo do recheo esquerdo) controla a distancia do texto ao bordo (esquerdo).
Este estilo é tan sinxelo coma un simple blog.
Copia e pega o seguinte estilo de fondo amarelo no ficheiro style.css do tema▼
blockquote { margin: 1em 3em; padding: .5em 1em; border-left: 5px solid #fce27c; background-color: #f6ebc1; } blockquote p { margin: 0; }
- Os anteriores son 2 estilos de cita en bloque.
- Engadir varios estilos idénticos sobrescribirase.
- Entón, escolla un deles e engádeo ao ficheiro style.css do tema.
Blog de Hope Chen Weiliang ( https://www.chenweiliang.com/ ) compartiu "Como usar blockquote? HTML no efecto de demostración da etiqueta blockquote, para axudarche.
Benvido a compartir a ligazón deste artigo:https://www.chenweiliang.com/cwl-2123.html