In diesem Artikel sehen Sie, wie Sie die bedingte Formatierung auf die Grenzen der Tabelle in Outlook anwenden. Ich werde Ihnen zeigen, wie Sie ihre Farbe, Breite und ihren Stil ?ndern. Dann werde ich Ihnen beibringen, wie Sie mehrere ?nderungen gleichzeitig vornehmen und Ihren Outlook -Tisch auf viele verschiedene Arten f?rben.

Zun?chst m?chte ich eine kleine Kopfnote für diese Blog -Newcomer machen. Da heute wir über bedingte Formatierung in Vorlagen sprechen, zeige ich Ihnen, wie Sie sie mithilfe unseres gemeinsam genutzten E-Mail-Vorlagen für Outlook korrekt einrichten. Mit diesem Tool k?nnen Sie vorgefertigte Vorlagen, die perfekt formatierte Vorlagen in Ihre E-Mails einfügen und Ihre Korrespondenzroutine auf einige Klicks verkleinern.

Wenn Sie meine bedingte Formatierung im Tutorial von Outlook Tabellen bereits gelesen haben, wissen Sie, wie Sie den Inhalt und die Hintergrundfarbe der Zellen ?ndern. Dies ist jedoch nicht alles, was Sie tun k?nnen, um Ihren Outlook -Tisch zu erhellen. Heute zeige ich Ihnen die M?glichkeit, die Grenzen Ihrer Tabelle bedingt zu f?rben und ihre Breite und ihren Stil zu ?ndern.

Darüber hinaus erwartet Sie im letzten Kapitel ein kleiner Bonus, in dem ich Ihnen zeige, wie Sie mehrere Modifikationen gleichzeitig anwenden und Ihren Tisch so farbenfroh und hell wie das Feuerwerk am ^4. Juli gestalten;)

?ndern Sie die Farbe der Zellenr?nder

Um Ihnen zu zeigen, wie das Gem?lde der Grenzen funktioniert, werde ich dieselben Beispiele aus dem Tutorial der letzten Woche verwenden. Der Fall ist Folgendes: Ich füge eine Vorlage ein und w?hle den Abzinsungssatz aus, um die Tabelle auszufüllen. Abh?ngig von meiner Wahl werden die Grenzen der Zelle in der jeweiligen Farbe gef?rbt.

Die Tabelle, die ich heute f?rben werde, w?re der unten:

Probenheader 1	Probenheader 2	Probenheader 3
~%Whattoenter [{Datensatz: 'Datensatz mit Rabatten', Spalte: 'Rabatt', Titel: 'Rabatt'}] Rabatt

Wenn die bedingte Formatierung in den HTML von Templates behandelt wird, ?ffnen wir zuerst den HTML -Code dieser Tabelle:

1. ?ffnen Sie die Interessensvorlage und klicken Sie auf Bearbeiten: Bearbeiten :

   

2. Suchen Sie das HTML -Symbol anzeigen ( ) in der Symbolleiste der Vorlage:

   

3. Siehe das ursprüngliche HTML, das mehrmals ge?ndert wird:

   

Wenn Sie sich über die Farben und ihre Verbindung mit Abzinsungss?tzen wundern, gebe ich Ihnen einen Hinweis :) Datensatz! Haben Sie keine Ahnung, was es ist? Machen Sie dann eine kleine Pause und lesen Sie zuerst mein Tutorial für füllbare Outlook -Vorlagen.

Hier ist der ursprüngliche Datensatz, den ich am Anfang verwenden werde, und mich in einigen Kapiteln ein wenig verbessern:

Rabatt	Farbcode
10%	#00B0F0
15%	#00B050
20%	#FFC000
25%	#4630a0

Wenn ich den erforderlichen Farbcode aus dieser Tabelle abrufen muss, werde ich das folgende Makro verwenden:

~%Whattoenter [{Datensatz: 'Datensatz mit Rabatten', Spalte: 'Color Code'}]

Da wir alle Grundlagen bedeckt haben, beginnen wir die Farben zu ?ndern :)

Aktualisieren Sie die Grenzfarbe einer Zelle

Um die Grenzen einer einzelnen Zelle in einer Tabelle zu f?rben, finden wir zun?chst ihre Linie in der HTML der Vorlage und schauen Sie sich die Komponenten genauer an:

~%Whattoenter [{Datensatz: 'Datensatz mit Rabatten', Spalte: 'Rabatt', Titel: 'Rabatt'}] Rabatt

• " Style = " repr?sentiert den Satz grundlegender Parameter einer Zelle.
• "Breite: 32%; Grenze: 1PX Solid #Aabab " sind die Breite, die Farbe und den Stil der Zellen und der Grenze.
• "~%WhattoTer [] Rabatt" ist der Inhalt der Zelle.

Diese Codezeile bedeutet, dass ich eine Zelle mit 1px grauen Grenzen eines soliden Stils sehen werde. Wenn ich diese Parameter ersetze, kann dies das Erscheinungsbild der Tabelle in meiner Vorlage besch?digen, dh die Grenzen sind unsichtbar (obwohl alles nach dem Einfügen perfekt aussehen wird).

Ich würde gerne eine Standardtabelle in einer Vorlage haben und sie beim Einfügen modifizieren lassen. Ich füge also ein neues Attribut mit den Parametern hinzu, die die ursprünglichen beim Einfügen ersetzen:

~%Whattoenter [{Datensatz: 'Datensatz mit Rabatten', Spalte: 'Rabatt', Titel: 'Rabatt'}] Rabatt

Untersuchen wir die HTML -Linie oben:

• ? Ist das erste Attribut. Das sind die ursprünglichen Eigenschaften der Zelle.
• " Data-Set-Style = " ist ein spezieller Parameter, der mir hilft, das obige Attribut durch die erforderlichen Eigenschaften w?hrend des Einfüges zu ersetzen.
• " Grenze: 1PX Solid; Border-Color: " ist Teil des zweiten Attributs, in dem wir eine Pause machen werden. Sehen Sie, der Anfang ist identisch mit dem Original, der gleichen Randbreite und dem gleichen Stil. Wenn es jedoch um die Farbe geht (den Parameter, den ich ?ndern m?chte), ersetze ich sie durch Grenzfarbe: und fügen Sie das Whattoterer-Makro ein. Abh?ngig von der Dropdown -Wahl wird das Makro durch den Farbcode ersetzt und der Rand wird neu gestrichen.
• "~%WhattoTer [] Rabatt" ist immer noch der Inhalt der Zelle, der keine ?nderungen erfordert.

Daher wird die volle HTML mit der zukünftig gef?rbten Zelle so aussehen:

Beispielheader 1	Beispielheader 2	Beispielheader 3
~%Whattoenter [{Datensatz: 'Datensatz mit Rabatten', Spalte: 'Rabatt', Titel: 'Rabatt'}] Rabatt	& nbsp;	& nbsp;

Wenn Sie diese Vorlage einfügen, wird der Rand der aktualisierten Zelle sofort in der ausgew?hlten Farbe gef?rbt:

Lackieren von Grenzen der gesamten Reihe

Lassen Sie uns nun die Grenzen in der gesamten Reihe unseres Probentischs malen und sehen, wie es funktioniert. Die Logik ist absolut die gleiche wie im obigen Absatz, au?er dass Sie alle Zellen der zweiten Zeile aktualisieren müssen. Sobald die gleichen Modifikationen, die ich oben abgedeckt habe, auf die ganze Reihe angewendet werden, wird es beim Einfügen der Vorlage in einem Augenzwinkern gemalt.

Wenn Sie einen Blick auf die Bereitschaftshtml mit der zweiten Reihe aussehen m?chten, hei?t es hier:

Beispielheader 1	Beispielheader 2	Beispielheader 3
~%Whattoenter [{Dataset: 'Dataset with Rabatte', Spalte: 'Rabatt', Titel: 'Rabatt'}] Rabatt	& nbsp;	& nbsp;

Grenzbreite ?ndern

Versuchen wir nun, nicht nur die Grenzfarbe, sondern auch die Breite zu aktualisieren. Schauen Sie sich das HTML -Attribut weiter an, das das Original beim Einfügen ersetzt:

Datensatz-> ~%Whattoenter [{Datensatz: 'Datensatz mit Rabatten', Spalte: 'Rabatt', Titel: 'Rabatt'}] Rabatt

Siehe den 1PX -Parameter? Dies ist die Breite der Grenzen, die gef?rbt werden müssen. Sie k?nnen es manuell in 2 ?ndern, beispielsweise 2 und die Tischgrenzen werden breiter, sobald Sie es eingefügt haben.

Ich werde es jedoch anders machen. Ich werde meinen Datensatz aktualisieren und eine neue Spalte mit Grenzen Breite hinzufügen. In diesem Fall werden sowohl Farbe als auch Breite eine vorliegende Rate zum Einfügen ausgew?hlt.

Rabatt	Farbcode	Grenzbreite
10%	#00B0F0	2
15%	#00B050	2.5
20%	#FFC000	3
25%	#4630a0	3.5

?ndern wir nun das zweite Attribut jeder Zeile und ersetzen Sie 1PX durch das folgende Textstück:

Grenzbreitweite: ~%Whattoenter [{Dataset: 'Datensatz mit Rabatten', Spalte: 'Grenzbreite'}]

Dann wiederhole ich es für alle drei Zellen der zweiten Reihe und bekomme das folgende HTML im Ergebnis:

Beispielheader 1	Beispielheader 2	Beispielheader 3
~%Whattoenter [{Dataset: 'Dataset with Rabatte', Spalte: 'Rabatt', Titel: 'Rabatt'}] Rabatt	& nbsp;	& nbsp;

Sobald diese Vorlage gespeichert und eingefügt wurde, erscheinen die rensigen Blue Borders in einer E -Mail:

?ndern Sie den Stil der Grenzen in einer Tabelle

In diesem Kapitel m?chte ich Ihre Aufmerksamkeit auf einen anderen Parameter - Stil lenken. Dieser wird mit dem Aussehen der Grenzen umgehen. Bevor ich Ihnen zeige, wie Sie es richtig anwenden, muss ich zu meinem Datensatz zurückkehren und gem?? meinem aktuellen Fall ?ndern.

Rabatt	Grenzstil
10%	Gestürzt
15%	Doppelt
20%	Gepunktet
25%	Grat

Ich habe jeden Abzinsungssatz mit einem Grenzstil verbunden und diesen Datensatz für die Zukunft gespeichert. Das Makro, um den Stil für mein HTML abzurufen, w?re der unten:

~%Whattoenter [{Datensatz: "Datensatz mit Rabatten", Spalte: "Border Style"}]

Jetzt muss ich die Attribute der zweiten Zeile aktualisieren, indem ich Solid (den Standardstil, den ich schon einmal verwendet habe) durch das Macro oben ersetzt, um das folgende Code -Stück zu erhalten:

Datensatzbreite: 100%; Grenzkollapse: Zusammenbruch; Grenzstil: solide; Border-Color: #aabab; "Border =" 1px ">

Beispielheader 1

Beispielheader 2

Beispielheader 3

~%Whattoenter [{Dataset: 'Dataset with Rabatte', Spalte: 'Rabatt', Titel: 'Rabatt'}] Rabatt

& nbsp;

& nbsp;

Wenn Sie diese HTML kopieren und in Ihre Vorlagen einfügen, wird das Ergebnis Sie nicht warten:

Richten Sie die bedingte Formatierung ein, um das Hervorhebung, die Textfarbe und die Grenzen gleichzeitig zu ?ndern

Wir haben den interessantesten Teil erreicht, als ich Ihnen zeigen m?chte, wie Sie mehrere Modifikationen gleichzeitig anwenden k?nnen. Zun?chst werde ich den Datensatz aktualisieren, von dem ich die Daten abrufen werde. Da ich mich entschlossen habe, die Hervorhebung der Zellen, die Textfarbe und die Grenzen der Zellen zu ?ndern, müssen all diese Parameter angegeben werden. Daher würde mein neuer Datensatz so aussehen:

Rabatt	Farbcode	Hintergrundcode	Grenzbreite
10%	#00B0F0	#Deebf6	2
15%	#00B050	#E2efd9	2.5
20%	#FFC000	#Fff2cc	3
25%	#4630a0	#FBE5D5	3.5

Wenn ich also 10%ausw?hle, wird der erforderliche Text blau gestrichen (# 00B0F0 ), der Hintergrund der ausgew?hlten Zellen wird in einem hellblauen Ton (# Deebf6 ) beschattet und ihre Grenzen werden zweimal erweitert.

Aber wie kann dieser Datensatz mit einer Outlook -Tabelle verbunden werden, damit er formatiert wird? Ich habe Sie in 2 Artikeln auf diese Aufgabe vorbereitet :) Hier geht es um die HTML, die alle notwendigen ?nderungen behandelt:

span data-set-> Beispielheader 1	span data-set-> Beispielheader 2	span data-set-> Beispielheader 3
data-set-> ~%Whattoenter [{Datensatz: 'Datensatz mit Rabatten', Spalte: 'Rabatt', Titel: 'Rabatt'}] Rabatt	data-set-> & nbsp;	data-set-> & nbsp;

Schauen wir uns nun alle angewandten Modifikationen an:

• Beispielheader 1 -Dieses Stück zeichnet den Header-Text in Farbe aus der Spalte ?Farbcode“ aus. Wenn Sie das Gefühl haben, Ihr Ged?chtnis auf die Textgem?lde zu aktualisieren, lesen Sie die ?nderung der Schriftfarbe des Textes in der Tabelle Kapitel meines vorherigen Tutorials.
• Datensatzfarbe: Purple; "> Data-Set-Lazy" decoding = "async" title = "Mehrere Modifikationen, die auf eine Tabelle und ihren Inhalt in einem Klick angewendet werden." src = "https://cdn.ablebits.com/_img-blog/table-borders/multiple-formating.png" Alt = "Mehrere Modifikationen, die auf eine Tabelle und deren Inhalt in einem Klick angewendet werden." width = "640" Height = "566" /> Es gibt eine kleine Notiz, die ich vor dem Schlie?en dieses Themas machen m?chte. W?hrend ich Grenzen in Tischen testete, wurde ich in Tischen mit ziemlich zweideutigem Verhalten von Grenzen in Online- und Desktop -Versionen von Outlook konfrontiert. Als ich ein bisschen verwirrt war, erreichte ich unsere Entwickler zur Kl?rung. Sie fanden heraus, dass verschiedene Outlook -Clients Tabellen auf unterschiedliche Weise rendern und der Grund für ein solches Verhalten ein Fehler in der Outlook ist.

  Unser Team hat dieses Problem an das Microsoft -Team gemeldet. Sehen Sie sich ihre Antwort in diesem GitHub -Gespr?ch an :)

  Endgültige Anmerkung

  Ich hoffe wirklich, ich habe es geschafft, Sie davon zu überzeugen, dass ein Tisch in Aussicht nicht nur schwarze Grenzen mit einfachem Text ist. Es gibt viel Raum für Verbesserungen und Kreativit?t :)

  Wenn Sie sich für eigene Malexperimente entscheiden, installieren Sie einfach gemeinsame E -Mail -Vorlagen von Microsoft AppSource und genie?en Sie!

  Wenn Fragen von Ihnen übrig sind, ben?tigen Sie Hilfe bei der bedingten Formatierung in Outlook -Tabellen, lassen Sie einfach ein paar W?rter im Kommentarbereich und wir werden es herausfinden.)

Das obige ist der detaillierte Inhalt von?ndern Sie die Randfarbe, die Breite und den Stil in Outlook Table. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!