HTML &CSS

Alle p-Elemente

        /* Verändert die Farbe von p*/

        p{

            color: seagreen;

        }

--------------------------------------------------------------------

        /* Verändert die Farbe von h1*/

        h1{

            color: salmon;

        }

Alle a-Elemente und p-Elemente

        /* Alle p Elemente UND h1 ein Underline*/

        h1, p{

            text-decoration: underline;

        }

Alle a-Elemente innerhalb von p (alle Nachfahren) ****

        /* Alle a Elmente innerhaln einers ul Element*/

        ul a{

            color: chartreuse;

        }

--------------------------------------------------------------

        /* Alle span in div's ( Egeal wie weit weg Grosseletrn usw.)*/

        div span{

            color: hotpink;

        }

/*Diese Regeln macht die erste Spalte jeder Zeile in einer Tabelle fettgedruckt*/

#data-table-1 td:first-child { 

     font-weight: bolder; 

Alle Elemente der Klasse ’foo’

        /* Alle Klassen foo bekommen monospace*/

        .foo{

            font-family: monospace;

        }

Alle div-Elemente mit der Klasse ’foo’

        /* Alle p mit der Klasse foo werden zentriert. ACHTUNG: Kein Leerzeichen zwischen foo und dem Punkt*/

        p.foo{

            text-align: center;

        }

Alle div-Elemente mit der id ’foo’ / Selektor für ID's

        /* Das Elemet mit der id lol*/ --> geht auch h1#lol

        #lol{

            font-family: sans-serif;

        }

Alle div-Elemente mit der Klasse ’foo’ innerhalb von td, d.h. innerhalb einer Tabellenzelle

Alle a-Elemente, welche das Attribute-Eigenschaft title enthalten

vergleicht Elemente basierend auf dem Vorhandensein oder Wert eines bestimmten Attributs

<ul>

     <li><a href="#internal">Internal link</a></li>

</ul>

/* Internal links, beginning with "#" */

a[href^="#"] {

     background-color: gold;

}