Heim > Web-Frontend > PS-Tutorial > Hauptteil

Der zweite Teil der Serie über den geschickten Einsatz von Photoshop für Front-End-Ingenieurfähigkeiten – Messung

高洛峰
Freigeben: 2017-02-20 09:27:45
Original
1558 Leute haben es durchsucht

Vorherige Wörter

Ein Großteil der Arbeit, die Front-End-Ingenieure mit Photoshop leisten, ist eigentlich Messung. Dieser Artikel ist der zweite Artikel in der Reihe der geschickten Verwendung von Photoshop – Messung

Messinformationen

Die Informationen, die mit Photoshop in der Webproduktion gemessen werden müssen, sind unterteilt in zwei Kategorien, nämlich Größeninformationen und Farbinformationen

 【1】Größeninformationen

Größeninformationen werden hauptsächlich über das rechteckige Auswahlwerkzeug und das Informationsfeld gemessen, einschließlich der folgenden Elemente:

1. Breite, Höhe

2. Abstand, Ränder

3. Rand

4. Positionierung

5. Textgröße

6. Linienhöhe

7. Position des Hintergrundbilds

[Hinweis] Machen Sie beim Messen die Leinwand so groß wie möglich, damit das Ergebnis relativ genauer ist

[2] Farbinformationen

Farbinformationen werden hauptsächlich über den Farbwähler gemessen, einschließlich der folgenden Elemente:
1. Rahmenfarbe

2. Hintergrundfarbe

3. Textfarbe

Praktischer Kampf

Als Nächstes erläutern wir anhand einiger tatsächlicher Messungen im Detail die wichtigsten Punkte bei der Verwendung von Photoshop zum Messen

[Bildbreite und -höhe messen]

 1 Messen Sie die Breite und Höhe eines gewöhnlichen Bildes

Zuerst Verwenden Sie das rechteckige Auswahlwerkzeug, um einen großen Bereich auszuwählen, und halten Sie dann die Alt-Taste gedrückt, subtrahieren Sie den Überschuss

前端工程师技能之photoshop巧用系列第二篇——测量篇 前端工程师技能之photoshop巧用系列第二篇——测量篇

 2 Messen Sie die Breite und Höhe eines großen Bereichs, der größer als 1 Bildschirm ist Zeichnen Sie zunächst mit dem rechteckigen Auswahlwerkzeug ganz links ein kleines Rechteck auf, halten Sie die Umschalttaste gedrückt und zeichnen Sie ein kleines Rechteck ganz rechts. Die Breiteninformationen im Informationsfeld sind die Breiteninformationen des zu messenden Bereichs

前端工程师技能之photoshop巧用系列第二篇——测量篇 前端工程师技能之photoshop巧用系列第二篇——测量篇
前端工程师技能之photoshop巧用系列第二篇——测量篇 前端工程师技能之photoshop巧用系列第二篇——测量篇

[Textgröße, Zeilenhöhe messen und Textfarbe]

 1. Wenn der Text eine separate Ebene ist

Sie können Informationen zu Textgröße, Zeilenhöhe und Textfarbe über mehrere Bedienfelder abrufen das Optionsfeld

 [Hinweis]Wenn die im Textfarbfeld ausgewählte Farbe nicht mit der angezeigten Farbe übereinstimmt, kann dies daran liegen, dass die Textfarbe durch andere Effekte verarbeitet wurde. In diesem Fall ist die Pipette weiterhin erforderlich die Farbe absorbieren

前端工程师技能之photoshop巧用系列第二篇——测量篇 前端工程师技能之photoshop巧用系列第二篇——测量篇

2. Wenn der Text in die Ebene eingefügt wurde, ist die Situation komplizierter

a. Schriftgröße

Für Texte in unterschiedlichen Schriftarten können unterschiedliche Schriftgrößen gelten. Im Allgemeinen wird der größte Text in einer Zeile für die Messung ausgewählt und das Ergebnis ist relativ genau

[Hinweis] Manchmal gibt es rechts oder unterhalb des Textes eine Lücke von 1 Pixel

b . Zeilenhöhe

Die Messung der Zeilenhöhe ist eigentlich die Messung einer Zeile vom unteren Ende der ersten Zeile bis zum unteren Ende der zweiten Zeile

c >

Verwenden Sie die Pipette. Bitte beachten Sie beim Absorbieren, dass nach dem Vergrößern des Textes viele gezackte Zeichen vorhanden sind. Absorbieren Sie daher die Teile mit Volltonfarben

前端工程师技能之photoshop巧用系列第二篇——测量篇 前端工程师技能之photoshop巧用系列第二篇——测量篇
前端工程师技能之photoshop巧用系列第二篇——测量篇 前端工程师技能之photoshop巧用系列第二篇——测量篇

[Größe von Buchstaben, Zahlen und Symbolen messen]

Geben Sie einen Buchstaben zum Vergleichen ein. Stellen Sie dann die Zeilenhöhe und die Schriftgröße so ein, dass sie einheitlich sind, achten Sie auf die Buchstaben und die Anzahl der Leerzeichen darüber und darunter und stellen Sie dann die Zeilenhöhe ein

【Fett einstellen】

Nach der Fetteinstellung haben die Buchstaben ein Pixel mehr, werden aber weiterhin entsprechend der ursprünglichen Schriftgröße berechnet. Nach dem Fettdruck wird die ursprüngliche 1-Pixel-Vertikallinie zu 2 Pixeln

前端工程师技能之photoshop巧用系列第二篇——测量篇 前端工程师技能之photoshop巧用系列第二篇——测量篇

[Farbe bestimmen]

1. Bestimmen Sie eine Volltonfarbe

Wenn das bloße Auge nicht erkennen kann, ob ein Bereich eine Volltonfarbe hat, können Sie das Farbauswahltool als Hilfe verwenden. Öffnen Sie das Farbauswahltool, halten Sie die Maus gedrückt und bewegen Sie es. Wenn sich der Farbwert ändert, handelt es sich nicht um eine Volltonfarbe

前端工程师技能之photoshop巧用系列第二篇——测量篇 前端工程师技能之photoshop巧用系列第二篇——测量篇

 2. Bestimmen Sie den linearen Farbverlauf

Wählen Sie zuerst die Ebene mit dem Verschieben-Werkzeug aus und klicken Sie dann mit dem Zauberstab-Werkzeug. Wenn alle horizontalen Streifen angezeigt werden, handelt es sich um einen linearen Farbverlauf mit vertikalen Farbänderungen

前端工程师技能之photoshop巧用系列第二篇——测量篇 前端工程师技能之photoshop巧用系列第二篇——测量篇

Hinweise

[1] Messen Sie beim Messen des Bildes die Breite des Inhaltsbereichs. Wenn ein Abstand vorhanden ist, subtrahieren Sie den Abstandswert

[2] Wenn es sich bei der Schriftart um eine Schriftart handelt, Leerzeichen Es ist halb so groß wie der Text

[3] Das Satzzeichen chinesischer Schriftzeichen nimmt die Größe eines Zeichens ein, und das Satzzeichen englischer Schriftzeichen nimmt die Größe eines halben Zeichens ein

[4] Der Doppelpunkt von 1 Pixel ist Im englischen Staat der Song-Dynastie kann der 4-Pixel-Doppelpunkt Chinesisch der Song-Dynastie oder Chinesisch und Englisch von Microsoft Yahei sein

[5] Wenn zwei Zeichen zu nahe beieinander liegen oder sogar überlappen, es handelt sich wahrscheinlich um einen Buchstabenabstand. Ist eine negative Zahl

[6] Wenn die Genauigkeit beim Ziehen der Referenzlinie nicht hoch ist, ziehen Sie zuerst die Referenzlinie heraus, ohne die Maus loszulassen. und halten Sie dann die Strg-Taste gedrückt, um die Referenzlinie um 0,1 Pixel zu verschieben

Für weitere Front-End-Ingenieurfähigkeiten, den zweiten Teil der Serie über den cleveren Einsatz von Photoshop – Messung. Für verwandte Artikel zahlen Sie bitte Achtung auf die chinesische PHP-Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage