o-mathe | Einstieg » Erarbeitung

Erarbeitung

Zielsetzung

Ziel ist es, Farben mit Hilfe von Zahlenlisten zu beschreiben.

Zahlenlisten zur Farbdarstellung verwenden

Das Applet aus dem letzten Absatz ist hier um eine Darstellung der Farben mit Hilfe von Zahlenlisten erweitert.

Die prozentuale Darstellung ${\vec{v}}_{r g b} = (\begin{matrix} 1 \\ 1 \\ 1 \end{matrix})$ ergibt sich direkt aus den Schiebereglereinstellungen.

In der Praxis wird häufig eine Darstellung der Form ${\vec{v}}_{R G B} = (\begin{matrix} 255 \\ 255 \\ 255 \end{matrix})$ benutzt. Bei dieser Darstellung werden Intensitäten durch binäre Werte repräsentiert, die man dann als natürliche Zahlen aus dem Bereich $0 \dots 255$ darstellt.

Aufgabe 1

Bestimme selbst ${\vec{v}}_{R G B}$ zur prozentualen Darstellung ${\vec{v}}_{r g b} = (\begin{matrix} 0.3 \\ 0.4 \\ 0.75 \end{matrix})$ und kontrolliere das Ergebnis mit dem Applet.

Aufgabe 2

Die Farbdarstellung von Webseiten wird üblicherweise in einer CSS-Datei festgelegt. Zur Farbdarstellung kann man u.a. Farbnamen oder Zahlenlisten mit RGB-Werten verwenden. Das folgende Beispiel (vereinfachte Version aus inf-schule) verdeutlicht diese Farbdarstellung.

Ersetze den Farbnamen black durch seinen RGB-Wert. Ändere die Farbe der Hyperlinks (gekennzeichnet mit dem Tag a) in Rot ab. Passe auch die anderen Farben geeignet an.

Historie einblenden

Quelltext CSS

xxxxxxxxxx
 
body
{
    background-color: rgb(173, 216, 230); 
    color: black;
}
h1, h2
{
    color: rgb(238, 130, 238);
}
a
{
    text-decoration: underline;
    color: rgb(0, 0, 139); 
}
a:hover
{
    background-color: rgb(0, 255, 255);
}
​

Quelltext HTML Body

xxxxxxxxxx
 
<h1>SV Musterstadt</h1>
<p>
    Das ist die Homepage des SV Musterstadt. Wir sind der älteste Sportverein der Stadt! Gegründet wurden wir 1895. 
</p>
<p>
    Aktuell hat der SV Musterstadt 144 Mitglieder.
</p>
​
<h2>Abteilungen des Vereins</h2>
<ol>
    <li>
        <a href="https://de.wikipedia.org/wiki/Fu%C3%9Fball">Fußball</a> 
    </li>
    <li>
        <a href="https://de.wikipedia.org/wiki/Handball">Handball</a>
    </li>
    <li>
        <a href="https://de.wikipedia.org/wiki/Volleyball">Volleyball</a>
    </li>
</ol>
​

Vorschau Webseite

Download Quelltext in die Zwischenablage kopieren

Aufgabe 3

Mit dem folgenden Programm kannst du versuchen, selbst die RGB-Werte vorgegebener Farben zu rekonstruieren. Schaffst du es, die Anteile der Grundfarben richtig zu wählen?

Quelle: inf-schule