Häufig verwendete Einheiten im CSS_Experience-Austausch

1. Längeneinheit

Die Längeneinheit ist die am häufigsten verwendete Einheit im Webseitendesign. Es ist unwahrscheinlich, dass eine unorganisierte und unorganisierte Seite bei den Menschen einen guten Eindruck hinterlässt. Daher müssen Sie beim Entwerfen einige Werte für die Position und Größe der Elemente genau definieren, um den gewünschten Effekt zu erzielen.

CSS gibt Menschen die Möglichkeit, Webseiten präzise zu steuern, worüber die Leute gerne sprechen. Es ermöglicht Menschen, Aussehen, Größe, Raum und andere Stile zu definieren. Allerdings ist die durch CSS gegebene Kontrolle auch eine gefährliche Sache. Dies spiegelt sich nicht nur in der mangelnden Erfahrung des Designers wider, sondern auch darin, wie man einen Größen- und Platzwert angibt. Warum? Denn obwohl ein Designer über eine bestimmte Bildschirmauflösung entscheiden kann, ist es unmöglich, über das Gehirn anderer Leute, das Sehvermögen anderer Leute oder diese personalisierten benutzerdefinierten Einstellungen zu entscheiden.

Eine der Hauptfunktionen von CSS ist die CSS-Positionierung. Das Konzept der Positionierung umfasst Positionierung und Größenpositionierung. Egal welche, Sie müssen die Längeneinheit verwenden, sonst ist eine genaue Positionierung nicht möglich.

In CSS ist die Länge eine Maßeinheit, die für Breite, Höhe, Schriftgröße, Wort- und Buchstabenabstand, Texteinzug, Zeilenhöhe, Ränder, Rahmen, Rahmenlinienbreite und viele, viele andere Eigenschaften verwendet wird .

1. Definieren Sie die Länge

Um die Länge in Dreamweaver 4 zu definieren, sollten Sie zunächst den Symbolteil in das Textfeld hinter der ausgewählten Option schreiben. Dieses Symbol kann „+“ (positives Vorzeichen) sein, was eine positive Länge darstellt Wert oder Kann „-“ (Minuszeichen) sein, was einen negativen Längenwert angibt. Wenn kein Vorzeichen geschrieben wird, ist der Standardwert „+“. Unmittelbar hinter dem Symbol steht ein numerischer Wert, der eine Ganzzahl oder eine Dezimalzahl sein kann. Wählen Sie dann im Dropdown-Listenfeld „Längeneinheit“ dieser Option eine Längeneinheit aus. Die Längeneinheit ist im Allgemeinen eine Einheitenabkürzung, die aus zwei Buchstaben besteht, z. B. cm, pt, em usw.

2． Absolute Längeneinheiten

Absolute Längenwerte, die üblicherweise in Webseitendefinitionen verwendet werden, umfassen Zentimeter (cm), Millimeter (mm), Zoll (in), Punkte (pt), Picas (pc) usw.

Einheiten Zoll (in) Zentimeter (cm) Millimeter (mm) Pfund (pt) Picas (pc) 4,233 12 1,0
cm 0,3937 1 10 28,3464 4,7244
mm 0,03937 0,1 1,0 2,83464 0,47244
lbs 0,01389 0,0352806 0,352806 1,0 0,83333

Verwendungsbereich absoluter Längenwerte Es ist eingeschränkter und verwendet nur absolute Längenwerte, wenn die Besonderheiten der externen Ausgabe berücksichtigt werden Gerät sind völlig bekannt. Mit anderen Worten, absolute Längenwerte werden am besten für Druckerausgabegeräte verwendet. Wenn sie nur für die Bildschirmanzeige verwendet werden, ist die Verwendung absoluter Längenwerte so weit wie möglich von Bedeutung. knowsky.com

 3. Relativer Längenwert

Jeder Browser verfügt über seinen eigenen standardmäßigen universellen Größenstandard, der vom System bestimmt oder vom Benutzer entsprechend seinen eigenen Vorlieben festgelegt werden kann. Daher ist diese Standardgröße häufig die Größe, die Benutzer am besten finden. Daher können Elemente, deren Größe angepasst werden muss, mithilfe relativer Längenwerte proportional entsprechend der Standardgröße skaliert werden. Dadurch ist es unmöglich, unleserliche Situationen zu schaffen. Tatsächlich können Prozenteinheiten und Schlüsselwörter ähnliche Effekte erzielen.

CSS unterstützt außerdem die folgenden drei relativen Längeneinheiten: em (die Breite des Buchstabens M in der aktuellen Schriftart), ex (die Höhe des Buchstabens X in der aktuellen Schriftart) und px (die Größe). von einem Pixel).

Der Zweck der Verwendung von em und ex besteht darin, die geeignete Breite für die jeweilige Schriftart festzulegen. Bei der Anzeige ist es nicht erforderlich, die Größe der Schriftart zu ermitteln X in der aktuellen Schriftart. Je größer die Schriftgröße, desto größer sind die entsprechenden Em- und Ex-Zeichen.

Die Länge in Pixel ist relativ zur Höhe und Breite eines Pixels (vielleicht eines Quadrats) auf dem Display. Bildbreite und -höhe werden häufig in Pixel angegeben. Die Pixelmessung ist im Allgemeinen keine gute Methode. Erstens variiert die Pixelgröße stark je nach Auflösung. Die meisten Benutzer stellen die Anzeige auf die höchstmögliche Auflösung ein, was dazu führt, dass die Pixel zu klein zum Lesen sind.

2. Prozenteinheit

Um den Prozentsatz in Dreamweaver 4 zu verwenden, sollten Sie zuerst den Symbolteil in das Textfeld hinter der ausgewählten Option schreiben. Dieses Symbol kann „+“ (Positiv) sein Vorzeichen), was einen positiven Längenwert angibt, oder „-“ (negatives Vorzeichen), was einen negativen Längenwert angibt. Wenn kein Vorzeichen geschrieben wird, ist der Standardwert „+“.Unmittelbar nach dem Symbol steht ein numerischer Wert. Sie können nach dem Symbol einen beliebigen Wert eingeben. Da der Browser jedoch in manchen Fällen keine Prozentsätze mit Dezimalzahlen verarbeiten kann, ist es am besten, keine Prozentsätze mit Dezimalzahlen zu verwenden. Wählen Sie dann „%“ im Dropdown-Listenfeld „Längeneinheit“ dieser Option aus.
Der Prozentsatz ist immer relativ zu einem anderen Wert. Dieser Wert kann eine Längeneinheit oder etwas anderes sein. Jede Eigenschaft, die mithilfe einer Prozentwerteinheit angegeben werden kann, definiert auch einen Referenzwert für diesen Prozentwert. In den meisten Fällen ist dieser Referenzwert die Schriftgröße des Elements selbst.

3. Farbeinheiten

Eine umfangreiche Verwendung von Bildern kann die Webseite lebendiger machen. Aber jeder, der schon einmal im Internet gesurft hat, kennt die Angst, auf ein Bild zu warten. Tatsächlich kann die richtige Verwendung unterschiedlicher Farben in verschiedenen Teilen auch einen bildähnlichen Effekt haben und die Aufmerksamkeit der Leser auf die wichtigsten Teile lenken. Allerdings wird die Zeit zum Herunterladen der Webseite erheblich verkürzt.

Das Farbattribut wird verwendet, um die Vordergrundfarbe eines Elements zu definieren. In den meisten Fällen wird das in diesem Element enthaltene Textobjekt verwendet. Die Verwendung des Farbattributs kann auch verwendet werden, um die Farbe des Randes eines Elements zu bestimmen. Die allgemeine Syntax zum Definieren von Farben lautet: Farbe: Farbwert.

Der einfachste und direkteste Weg, Farbwerte zu definieren, ist die Verwendung von Prozentwerten. Dabei werden die Anteile der Farbwerte Rot, Grün und Blau als Prozentwerte ermittelt. Das Format ist: Farbe:rgb(R%,G%,B%). Ein zusätzlicher Vorteil der Verwendung eines Prozentwerts zur Angabe einer Farbe besteht darin, dass unabhängig vom Wert eine reale Menge von Zahlen deklariert wird.

Eine andere Möglichkeit, eine Farbe anzugeben, ist die Verwendung einer Ganzzahl im Bereich von 0 bis 255. Das Format ist color:rgb(128,128,128).
Die dritte Möglichkeit, eine Farbe zu definieren, besteht darin, ein hexadezimales Array zum Definieren der Farbe zu verwenden. Diese Definitionsmethode ist Leuten bekannt, die häufig programmieren. Verwenden Sie beim Definieren einer Farbe drei nacheinander angeordnete Hexadezimal-Arrays, z. B. „#FC0EA8“.Diese Definition hat das Format #RRGGBB. Das heißt, addieren Sie die erforderlichen Hexadezimalwerte zu den Positionen Rot, Grün und Blau.

Die letzte und einfachste Möglichkeit, eine Farbe zu definieren, besteht darin, einen Namen für die Farbe anzugeben. Der unten gezeigte Code gibt beispielsweise an, dass die Farbe des Texts lila ist.

In Dreamweaver 4 können Sie auf das Farbauswahlsymbol klicken, um eine geeignete Farbe aus der geöffneten Farbauswahl auszuwählen.

4. URL-Einheit

URL-Einheit bezieht sich auf die Linkadresse. Die sogenannte URL ist die Abkürzung für „Uniform Resource Locator“ und der Link ist die Seele der Webseite. Durch Links können verschiedene Webseiten miteinander verbunden werden, sodass viele Seiten der Website ein organisches Ganzes bilden und es Besuchern ermöglicht, zwischen verschiedenen Seiten zu wechseln. Ein Link kann ein Textstück, ein Bild oder ein anderes Webseitenelement sein. Wenn im Browser mit der Maus auf diese Objekte geklickt wird, kann der Browser entsprechend seinen Anweisungen eine neue Seite laden oder zu anderen Stellen auf der Seite springen.

Beim Erstellen von Links ist der Pfad sehr wichtig. In Dreamweaver 4 gibt es zwei Arten von Pfaden: absolute Pfade und relative Pfade können in Pfade relativ zum Stammverzeichnis und Pfade relativ zur Datei unterteilt werden.

Der absolute Pfad enthält den vollständigen Pfad des Serverprotokolls (normalerweise http:// oder ftp:// auf einer Webseite). Ein absoluter Pfad enthält den genauen Speicherort, unabhängig vom Speicherort des Quelldokuments. Wenn das Zieldokument jedoch verschoben wird, ist der Link ungültig. Beim Erstellen von Links zu Dateien außerhalb der aktuellen Site müssen absolute Pfade verwendet werden.

Pfade relativ zum Stammverzeichnis beginnen immer im Stammverzeichnis der aktuellen Site. Alle öffentlich verfügbaren Dateien auf der Site werden im Stammverzeichnis der Site gespeichert. Pfade relativ zum Stammverzeichnis verwenden Schrägstriche, um dem Server mitzuteilen, dass er vom Stammverzeichnis aus starten soll. Beispielsweise wird /Dreamweaver/index.html mit der Datei index.html im Dreamweaver-Ordner im Stammverzeichnis Ihrer Site verknüpft. Wenn Sie Dateien in einer Umgebung verknüpfen, in der Inhalte häufig verschoben werden, ist die Verwendung eines Pfads relativ zum Stammverzeichnis oft der beste Ansatz. Wenn Pfade relativ zum Stammverzeichnis verwendet werden, werden Dokumente, die Links enthalten, innerhalb der Site verschoben, ohne dass die Links beschädigt werden. Für die lokale Anzeige der Site eignen sich jedoch Pfade relativ zum Stammverzeichnis. In diesem Fall können Sie Pfade relativ zum Dokument verwenden.

Hinweis: Bei der lokalen Vorschau der Datei im Browser wird der mit dem Pfad relativ zum Stammverzeichnis verknüpfte Inhalt nicht angezeigt. Dies liegt daran, dass der Browser das Stammverzeichnis der Site nicht auf die gleiche Weise erkennt wie der Server. Um eine Vorschau des mit einem Pfad relativ zum Stammverzeichnis verknüpften Inhalts anzuzeigen, muss die Datei auf dem Remote-Server abgelegt und von dort aus angezeigt werden.

Der Pfad relativ zum Dokument bezieht sich auf den Pfad relativ zum Ordner, in dem sich das aktuelle Dokument befindet. Das Dokument test.swf befindet sich beispielsweise im Ordner Flash und gibt das Dokument im aktuellen Ordner an. …/test.swf gibt das Dokument im übergeordneten Verzeichnis des aktuellen Ordners an und /test/test.swf gibt das test.swf-Dokument im Testordner unter dem Flash-Ordner an. Dokumentrelative Pfade sind normalerweise die einfachsten Pfade, die zum Verknüpfen mit Dateien verwendet werden können, die sich immer im selben Ordner wie das aktuelle Dokument befinden.

Hinweis: Sie müssen die neue Datei speichern, bevor Sie einen Pfad relativ zum Dokument erstellen, da ein Pfad relativ zum Dokument ungültig ist, wenn kein Startpunkt definiert ist. Dreamweaver 4 verwendet vor dem Speichern des Dokuments automatisch einen absoluten Pfad, der mit Datei:// beginnt.