INHOUDSOPGAWE
In hierdie artikel sal jy sien hoe om voorwaardelike formatering op tabel se grense in Outlook toe te pas. Ek sal jou wys hoe om hul kleur, breedte en styl te verander. Dan sal ek jou leer hoe om verskeie wysigings op 'n slag te maak en jou Outlook-tabel op baie verskillende maniere in te kleur.
Eerstens wil ek 'n klein kopnota maak vir die nuwelinge van hierdie blog. Aangesien ons vandag oor voorwaardelike formatering in sjablone sal praat, sal ek jou wys hoe om dit korrek op te stel deur ons Gedeelde e-possjablone-byvoeging vir Outlook te gebruik. Hierdie hulpmiddel kan jou help om vooraf-gestoorde perfek geformateerde sjablone in jou e-posse te plak en jou korrespondensieroetine tot 'n kwessie van 'n paar klikke te verklein.
As jy reeds my Voorwaardelike formatering in Outlook-tabelle-tutoriaal gelees het, weet jy hoe om die selle se inhoud en agtergrondkleur te verander. Dit is egter nie alles wat u kan doen om u Outlook-tabel op te helder nie. Vandag sal ek jou die maniere wys om jou tafel se rande voorwaardelik in te kleur en hul breedte en styl te verander.
Boonop wag daar 'n klein bonus op jou in die laaste hoofstuk waar ek jou sal wys hoe om verskeie wysigings toe te pas terselfdertyd en maak jou tafel so kleurvol en helder soos die vuurwerke op die 4de Julie ;)
Verander die kleur van selle se rande
Om jou te wys hoe die grense se skildery werk, Ek sal dieselfde voorbeelde van die afgelope week se tutoriaal gebruik. Die saak is die volgende: Ek plak aMicrosoft-span, kyk gerus na hul reaksie in hierdie GitHub-gesprek :)
Laatste nota
Ek hoop regtig ek het dit reggekry om jou te oortuig dat 'n tabel in Outlook nie net swart grense met plain is nie teks. Daar is baie ruimte vir verbetering en kreatiwiteit :)
Wanneer jy besluit om 'n paar skildereksperimente van jou eie te neem, installeer net gedeelde e-possjablone van Microsoft Store en geniet dit!
As daar is enige vrae oor van jou het hulp nodig met voorwaardelike formatering in Outlook-tabelle, los net 'n paar woorde in die Kommentaar-afdeling en ons sal dit uitvind ;)
sjabloon en kies die verdiskonteringskoers om die tabel in te vul. Afhangende van my keuse, sal die sel se grense in die spesifieke kleur gekleur wees.Die tabel wat ek vandag gaan inkleur, sal die een hieronder wees:
Voorbeeldopskrif 1 | Voorbeeldopskrif 2 | Voorbeeldopskrif 3 |
~%WhatToEnter[ {dataset:'Dataset met afslag', kolom:' Discount', title:'Select discount'} ] afslag |
Aangesien voorwaardelike formatering in sjablone se HTML hanteer word, kom ons maak eers hierdie tabel se HTML-kode oop:
- Maak die sjabloon van belang oop en druk Redigeer :
- Vind die Bekyk HTML -ikoon ( ) op die sjabloon se nutsbalk:
- Sien die oorspronklike HTML wat verskeie kere gewysig sal word:
As jy wonder oor die kleure en hul verband met afslagkoerse, sal ek jou 'n wenk gee :) Datastel! Het jy geen idee wat dit is nie? Neem dan 'n klein pouse en lees eers my Invulbare Outlook-sjablone-tutoriaal.
Hier is die oorspronklike datastel wat ek aan die begin sal gebruik en 'n bietjie sal verbeter in 'n paar hoofstukke:
Afslag | Kleurkode |
10% | #00B0F0 |
15 % | #00B050 |
20% | #FFC000 |
25% | #4630A0 |
Wanneer ek die nodige kleurkode uit hierdie tabel moet haal, sal ek die volgende makro gebruik:
~%WhatToEnter[{dataset:'Dataset met afslag',kolom:'Kleurkode'}]Aangesien ons al die basiese beginsels het, laat ons begin om kleure te verander :)
Dateer die randkleur van een op sel
Om die grense van 'n enkele sel in 'n tabel in te kleur, kom ons vind eers sy lyn in die sjabloon se HTML en kyk na die komponente daarvan:
- “ styl= ” verteenwoordig die stel basiese parameters van 'n sel.
- “wydte: 32%; rand: 1px solied #aeabab ” is die sel en rand se breedte, kleur en styl.
- “~%WhatToEnter[] afslag” is die sel se inhoud.
Hierdie kodelyn beteken dat ek 'n sel met 1px grys rande van 'n soliede styl sal sien. As ek enige van daardie parameters vervang, kan dit die voorkoms van die tabel in my sjabloon beskadig, d.w.s. die grense sal onsigbaar wees (hoewel alles perfek sal lyk nadat dit geplak is).
Ek sal graag 'n standaard wil hê tabel in 'n sjabloon en laat dit verander wanneer dit geplak word. So, ek voeg een nuwe kenmerk by met die parameters wat die oorspronklike sal vervang wanneer dit geplak word:
Kom ons ondersoek die HTML-reël hierbo:
- “ style="border : 1px solid #aeabab;" is die eerste eienskap. Dit is die sel se oorspronklikekenmerke.
- “ data-set-style= ” is 'n spesiale parameter wat my sal help om die kenmerk hierbo te vervang met die nodige stel eienskappe tydens plak.
- “ grens:1px solied; border-color: " is die deel van die tweede kenmerk waar ons 'n pouse sal neem. Sien, die begin is identies aan die oorspronklike, dieselfde randwydte en styl. As dit egter by die kleur kom (die parameter wat ek wil verander), vervang ek dit met grenskleur: en plak die WhatToEnter-makro. Gevolglik, afhangende van die keuselys, sal die makro vervang word met die kleurkode en die rand sal oorgeverf word.
- “~%WhatToEnter[] afslag” is steeds die sel se inhoud wat vereis geen veranderinge nie.
Daarom sal die volledige HTML met die toekomsgekleurde sel soos volg lyk:
Wanneer jy hierdie sjabloon plak , sal die rand van die opgedateerde sel dadelik in die gekose kleur ingekleur word:
Verf die rande van die hele ry
Kom ons verf nou die grense op die hele ry van ons voorbeeldtabel en kyk hoe dit werk. Die logika is absoluut dieselfde as in dieparagraaf hierbo, behalwe dat jy al die selle van die tweede ry moet opdateer. Sodra dieselfde wysigings wat ek hierbo gedek het op die hele ry toegepas is, word dit in 'n knipoog geverf wanneer die sjabloon geplak word.
As jy wil kyk na die gereed HTML met die tweede ry kleur, hier gaan dit:
Verander randwydte
Kom ons probeer nou om nie net die randkleur op te dateer nie, maar ook die breedte daarvan. Kyk nog een keer na die HTML-kenmerk wat die oorspronklike een vervang wanneer jy plak:
data-set-style="border: 1px solid; border-color:~%WhatToEnter[{dataset:' Datastel met afslag',kolom:'Kleurkode'}]">~%WhatToEnter[{datastel:'Dataset met afslag',kolom:'Afslag',titel:'Kies afslag'}] afslagSien die <0 1>1px parameter? Dit is die breedte van die grense wat gekleur moet word. Jy kan dit met die hand verander na byvoorbeeld 2 en die tabelgrense sal wyer word sodra jy dit plak.
Ek sal dit egter op 'n ander manier doen. Ek sal my datastel opdateer en 'n nuwe kolom met grense breedte byvoeg. In hierdie geval, sodra ek 'n huidige koers kies om te plak, sal beide kleur en breedte weesopgedateer.
Afslag | Kleurkode | Randwydte |
10% | #00B0F0 | 2 |
15% | #00B050 | 2.5 |
20% | #FFC000 | 3 |
25% | #4630A0 | 3.5 |
Kom ons verander nou die tweede kenmerk van elke reël en vervang 1px met die volgende stukkie teks:
border-width:~%WhatToEnter [{dataset:'Dataset met afslag',kolom:'Randwydte'}]Dan herhaal ek dit vir al die drie selle van die tweede ry en kry die volgende HTML in die resultaat:
Sodra hierdie sjabloon gestoor en geplak is, sal die groter blou grense in 'n e-pos verskyn:
Verander grensstyl in 'n tabel
In hierdie hfst ek wil u aandag vestig op 'n ander parameter - styl. Hierdie een sal die voorkoms van die grense hanteer. Voordat ek jou wys hoe om dit korrek toe te pas, sal ek moet terugkom na my datastel en dit moet verander in ooreenstemming met my huidige geval.
Afslag | Grensstyl |
10% | Gestreepte |
15% | Dubbel |
20% | Gestippel |
25% | Rif |
Ek het elke verdiskonteringskoers met 'n grensstyl geassosieer en hierdie datastel vir die toekoms gestoor. Die makro om die styl vir my HTML te herwin sal die een hieronder wees:
~%WhatToEnter[{dataset:"Dataset met afslag",kolom:"Grensstyl"}]Nou sal ek die tweede ry se eienskappe deur soliede (die verstekstyl wat ek al die tyd gebruik het) met die makro hierbo te vervang om die volgende stukkie kode te kry:
data-set-style="border: 1px #aeabab; border-style: ~%WhatToEnter[{dataset:'Dataset met afslag',kolom:'Grensstyl'}]Hier is die finale HTML:
As jy hierdie HTML kopieer en plak vir jou sjablone, die resultaat sal nie op jou laat wag nie:
Stel voorwaardelike formatering op om die verligting, tekskleur en grenswydte terselfdertyd te verander
Ons het die meeste belangstellings bereik deel soos ek op die punt is om jou te wys hoe om veelvuldige wysigings op 'n slag toe te pas. Eerstens sal ek die datastel waaruit ek die data gaan haal, opdateer.Aangesien ek besluit het om die selle se verligting, tekskleur en grenswydte te verander, moet al daardie parameters gespesifiseer word. Gevolglik sal my nuwe datastel so lyk:
Afslag | Kleurkode | Agtergrondkode | Randwydte |
10% | #00B0F0 | #DEEBF6 | 2 |
15 % | #00B050 | #E2EFD9 | 2.5 |
20% | #FFC000 | #FFF2CC | 3 |
25% | #4630A0 | #FBE5D5 | 3.5 |
So, as ek 10% kies, sal die nodige teks in blou geverf wees (# 00B0F0 ), die agtergrond van die gekose selle sal ingekleur word 'n ligblou toon (# DEEBF6 ) en hul grense sal twee keer verbreed word.
Maar hoe kan hierdie datastel aan 'n Outlook-tabel gekoppel word sodat dit geformateer word? Ek het jou in 2 artikels voorberei vir hierdie taak :) Hier volg die HTML wat al die nodige wysigings sal hanteer:
Kom ons kyk nou na al die wysigings wat toegepas is:
- Voorbeeldopskrif 1 - hierdie stuk sal die opskrifteks in kleur verf vanaf die "Kleurkode"-kolom. As jy voelsoos jy jou geheue op die teksskildery moet verfris, verwys na die Verander die lettertipekleur van teks in tabel hoofstuk van my vorige tutoriaal.
- data-set-style="background-color:~%WhatToEnter[ {datastel:'Dataset met afslag',kolom:'Agtergrondkode',titel:'Kies afslag'}] - hierdie deel werk die agtergrondkleur op deur sy kode uit die Agtergrondkode -kolom van die datastel te neem. Kyk gerus na die Highlight cells-tutoriaal as jy voel jy benodig 'n meer gedetailleerde beskrywing van hierdie saak.
- data-set-style="border: solid #aeabab; border-width:~%WhatToEnter[{dataset:'Dataset met afslag',kolom:'Border width'}] – met hierdie HTML-lyn sal grense se breedte verander word na die een gespesifiseer in die Border width Ek het dit vroeër gedek, jy kan dalk kyk as jy iets gemis het.
Wanneer ek 'n sjabloon plak met daardie eienskappe bygevoeg, sal die resultaat my nie laat wag nie:
Daar is 'n klein nota wat ek graag wil maak voordat ek hierdie onderwerp afsluit. Terwyl ek grense in tabelle getoets het, het ek nogal dubbelsinnige gedrag van grense in beide aanlyn- en rekenaarweergawes van Outlook gekonfronteer. Omdat ek 'n bietjie deurmekaar was, het ek ons ontwikkelaars bereik vir verduideliking. Hulle het uitgevind dat verskillende Outlook-kliënte tabelle op verskillende maniere weergee en die rede vir sulke gedrag is 'n fout in Outlook.
Ons span het hierdie probleem aangegee aan