CSS y WordPress

Referencias para principiantes:

CSS (Cascading Style Sheets) son trozos de código que influyen en la presentación o apariencia del código HTML de su página. En WordPress, los estilos CSS generalmente se encuentran en un archivo llamado style.css en la carpeta específica del Tema que está usted usando. El código HTML y las referencias de CSS que sostienen la estructura de su página generalmente se encuentran en el archivo index.php en la carpeta de su Tema.

Los selectores CSS (nombres) están generalmente agrupados en tres referencias específicas: ID, CLASS, y etiquetas HTML.

El ID

El ID es una referencia a un área específica única sobre su página web. Generalmente se ve representado en su página web HTML como un bloque DIV (división) adjunto:

<div id="header">Título de la Página</div>

En la hoja de estilo (CSS) el selector ID está referenciado como #header y podría parecerse a esto:
#header { position: relative; margin:0; padding:0;
        height:100px; width: 100%; background: red;
        color: white;}

La CLASE

La CLASE es una referencia a cualquier elemento en una página que debe tener un aspecto específico cuando se usa esta referencia. Por ejemplo, si quiere resaltar una palabra o dos dentro de su texto con frecuencia, puede tener un selector de CLASE en su hoja de estilo como este:

.hilite { color: red}
y la referencia en su HTML podría parecerse a esto:
...this is some text about something
I want <span class="hilite">in red</span>. And
some more rambling here...

Como puede ver, la diferencia entre los selectores ID y CLASS en la hoja de estilo es que una ID usa un signo numeral (#name) y una CLASS usa un punto (.name). Las referencias de identificación deben ser únicas en una página y usadas solamente una vez. Las referencias de CLASE pueden ser usadas repetidamente en la misma página.

Etiquetas HTML

Si usted quiere "diseñar" una etiqueta de referencia de HTML específica, como una cita (blockquote), el código dentro de la página web puede parecerse a esto:

<blockquote>This is a pithy and brilliant quote
that I knew you would enjoy.</blockquote>

En la hoja de estilo, la referencia a la cita en bloque no tendría un # o un punto, sino que simplemente listaría el HTML y luego los elementos de diseño.

blockquote { position: relative; margin: 10px 50px 10px 50px;
        padding:5px;  font-style:italic;
        border-left:solid blue 4px; }

Usted puede aplicar cualquier elemento de diseño a cualquier etiqueta específica de HTML como body, p, H1, H2, H3, ul, li, y más.

Fuente: WordPress.org