Kā pielāgot Firefox Reader skatu labākai lasīšanai
Lasītāja skats ir populāra Firefox pārlūka iezīme maina izskatu Web lapas, un padara to lasāmāku līdz novēršot redzes traucējumus piemēram, attēlus, reklāmas, galvenes un sānjoslas. Lasītāja skats tomēr nav pieejams visām mājas lapām.
Ja šī funkcija ir pieejama noteiktai lapai, jūs atradīsiet ikonu, lai to iespējotu a mazas grāmatas ikona tiek parādīts adreses joslas labajā pusē.
Ir dažas iebūvētās iespējas, kas ļauj lasītājiem pielāgot izskatu Lasītāja skats. Mēs parādīsim šīs opcijas, pirms parādīsim, ko jūs varat darīt, lai vēl vairāk personalizētu lasītāja skata izskatu. Demonstrācijas nolūkos es izmantošu National Geographic rakstu.
Iepriekš uzstādītas opcijas
Firefox Reader View piedāvā dažas iepriekš izveidotas pielāgošanas opcijas, piemēram, tumšs, viegls un sēpijas fona, regulējams fonta lielumus, un serifs un sans-serifs šriftus. Jūs varat pielāgot motīvu CSS noteikumus no šīm iepriekšējām iespējām.
Es izmantoju tumšu ādu ar serif fontiem, un tas nozīmē, ka man būs jānovērš piederošās CSS klases, manā gadījumā .tumšs un .serifs.
Ja vēlaties pielāgot citu tēmas variantu (ādu + fontu), jums būs nepieciešams izmantot atbilstošos CSS selektorus. Jūs varat tos pārbaudīt, izmantojot Firefox izstrādātāju rīkus, hitting F12.
Izveidojiet pielāgoto CSS failu
Jums ir nepieciešams izveidot failu, ko sauc userContent.css iekšpusē hroms mape jūsu Firefox profila mapi jūsu Reader View pielāgojumiem. Lai atrastu savu Firefox profila mapi, ierakstiet par: atbalsts URL joslā un nospiediet taustiņu Enter.
Jūs atradīsiet lapu lapā, kurā ir tehniskie dati, kas saistīti ar jūsu Firefox instalēšanu. Noklikšķiniet uz pogas Rādīt mapi, un tā atvērs jūsu profila mapi.
Izveidojiet saucamo mapi hroms iekšpusē profila mape (ja jums tas vēl nav), un fails, ko sauc userContent.css iekšpusē hroms mapi. Faila ceļš izskatās šādi:
… Profili \ throma lietotājsContent.css
Pievienojiet pielāgotos CSS noteikumus
Kad esat izveidojis un atvēris userContent.css koda redaktorā ir pienācis laiks pievienot savus CSS noteikumus. Lai pielāgotu lasītāja skata dizainu, jums ir nepieciešams mērķēt uz ar atbilstošiem selektoriem.
Varat izmantot šādus atlasītājus dažādām noklusējuma opcijām:
/ * Ja ir izvēlēts tumšs fons * /: root [hasbrowserhandlers = "true"] body.dark / * Ja ir izvēlēts gaismas fons * /: root [hasbrowserhandlers = "true"] body.light / * Ja sēpija fons ir atlasīts * /: root [hasbrowserhandlers = "true"] body.sepia / * Kad ir izvēlēts serif fonts * /: root [hasbrowserhandlers = "true"] body.serif / * Kad sans-serif fonts ir atlasīts * /: root [hasbrowserhandlers = "true"] body.sans-serif
Varat arī kombinēt klases, lai mērķētu konkrētu iestatījumu kombināciju.
/ * Ja ir izvēlēts tumšs fons un serif fonts * /: root [hasbrowserhandlers = "true"] body.dark.serif / * Ja ir izvēlēts sēpijas fons un sans-serif fonts * /: root [hasbrowserhandlers = "true" ] body.sans-serif.sepia
Nelietojiet kopējais selektors : root [hasbrowserhandlers = "true"] ķermenis lai vienlaikus iestatītu visus iestatījumus. Tā darbosies, bet tā būs ietekmē arī citas pārlūka lapas, piemēram, par: newtab, kā to saknes elementi arī ved hasbrowserhandlers atribūts (ko izmanto, lai atzīmētu iekšējo Firefox lapu, piemēram, par: lapas).
Šeit ir kods, ko pievienoju savam userContent.css. Es mainīju fontu saimi, fontu stilu, krāsas un paplašināju teksta konteineru. Jūs varat izmantot citus stila noteikumus atbilstoši savai gaumei.
/ ** userContent.css *************************** /: root [hasbrowserhandlers = "true"] body.dark.serif,: root [hasbrowserhandlers = "true"] body.dark.serif # lasītājs-domēns font-family: "courier new"! : root [hasbrowserhandlers = "true"] body.dark.serif fona krāsa: # 13131F! krāsa: # BAE3DB! : root [hasbrowserhandlers = "true"] body.dark.serif # lasītājs-domēns font-style: slīprakstā! : root [hasbrowserhandlers = "true"] body.dark.serif h1,: root [hasbrowserhandlers = "true"] body.dark.serif h2,: root [hasbrowserhandlers = "true"] body.dark.serif h3,: root [hasbrowserhandlers = "true"] body.dark.serif h4,: root [hasbrowserhandlers = "true"] body.dark.serif h5 color: # 06FEB0! svarīgi; : root [hasbrowserhandlers = "true"] body.dark.serif a: saite krāsa: # 83E7FF! : root [hasbrowserhandlers = "true"] body.dark.serif #container max-width: 50em! svarīgi;
Ņemiet vērā, ka ir nepieciešams izmantot !svarīgs atslēgvārdu userContent.css visiem CSS noteikumiem. Pārlūks pievieno lietotāja norādītās īpašuma vērtības pirms autora norādītajām vērtībām (konkrētās tīmekļa lapas izstrādātājs, šeit lasītāja skats). Līdz ar to jebkura lietotāja noteiktā īpašuma vērtība bez !svarīgs atslēgvārds nedarbosies, ja autora norādītā stila lapa būs vērsta arī uz to pašu īpašumu, jo tā tiks ignorēta.
Galīgais rezultāts
Tālāk ir redzamas manas lasītāja skatījuma tēmas izmaiņas. Izmantojiet savus CSS noteikumus, lai pielāgotu savu personalizēto Firefox Reader skatu.
Pirms tam
Pēc
Ja vēlaties dziļāk ienirt Firefox rīku tēmu pielāgošanā, skatiet manu iepriekšējo pamācību par Firefox izstrādātāju rīku pielāgošanas tēmu.
