Cookies op Tweakers

Tweakers is onderdeel van DPG Media en maakt gebruik van cookies, JavaScript en vergelijkbare technologie om je onder andere een optimale gebruikerservaring te bieden. Ook kan Tweakers hierdoor het gedrag van bezoekers vastleggen en analyseren. Door gebruik te maken van deze website, of door op 'Cookies accepteren' te klikken, geef je toestemming voor het gebruik van cookies. Wil je meer informatie over cookies en hoe ze worden gebruikt? Bekijk dan ons cookiebeleid.

Meer informatie
Toon posts:

[CSS] Tekst vergroten

Pagina: 1
Acties:

Vraag


  • Frozen
  • Registratie: oktober 2010
  • Laatst online: 15:36

Frozen

2e Reviewer van het Jaar

Topicstarter
Ik probeer via custom CSS tekst te vergroten op mijn website. De tekst staat in een plugin en ik kan via de Chrome browser wat dingen aanpassen waardoor de tekst groter wordt. Echter lukt het mij niet om dit vervolgens bij het Custom CSS gedeelte van mijn website werkend te krijgen.



Wat ik wil:
Ik wil de tekst "Recent Posts" vergroten.

Hoe is mij dat al eerder gelukt:
Ik vulde in de chromebrowser onderaan tussen
element.style {
en
}
het volgende in:
font-size: 40px;
waardoor de text inderdaad groter werd.

Nu moet ik echter dit stuk code aan de plugin geven zodat hij er dan voor kan zorgen dat dit voortaan altijd gedaan wordt en niet alleen als ik bovenstaande stappen herhaal.

Hoe doe ik dat?
code:
1
2
3
element.style {
font-size: 40px;
}

Bovenstaande code doet namelijk helemaal niets wanneer ik dat kopieer en in de custom css plugin plak. 7(8)7 Ook de website https://www.w3schools.com/cssref/sel_class.asp kon mij helaas niet verder helpen.

Voeg me gewoon toe op LinkedIn, iedereen is welkom!

Beste antwoord (via Frozen op 10-10-2018 00:47)


  • CH4OS
  • Registratie: april 2002
  • Niet online

CH4OS

It's a kind of magic

Probeer het eens met
Cascading Stylesheet:
1
2
3
.elementor-widget-container h5 {
    font-size: 40px;
}
in het CSS-bestand. Hiermee worden wel alle overeenkomsten vergroot, terwijl je misschien enkel de Recent Posts wilt, dan moet je die gewoon een eigen class meegeven zodat het door de CSS te selecteren is.

Overigens is element.style iets van de browser in de inspector. Dat geeft aan dat de styling toegapast is middels het style-attribuut van de tag en dat werkt dus alleen lokaal als je via de inspector het aanpast. ;) Je zult dus iets anders moeten hebben om het mee te selecteren, o.a. met bovenstaand kan dat. CSS werkt namelijk met classes en ID's, de classes worden aangeduid met een . in de CSS en de ID's met een #.

Wellicht is het dus ook een idee, als je het interessant vind, om een cursusje HTML en CSS te pakken?
Zodat eea duidelijker wordt en je niet als kip zonder kop aan de slag gaat? ;) Genoeg cursussen voor te vinden. Ik denk dat codecadamy.com dan wel een mooi begin is.
vikterr schreef op woensdag 10 oktober 2018 @ 00:31:
Probeer eens met !important erachter
De selector is niet goed, dus !important gebruiken gaat niet helpen. Important gebruiken is overigens ook het laatste wat ik altijd doe, important lijkt makkelijk, maar kan later voor kopzorgen zorgen, dat wil je echt zoveel mogelijk voorkomen tenzij het echt niet anders kan.

[Voor 74% gewijzigd door CH4OS op 10-10-2018 00:43]

[ Steam ][ Diablo ][ CptChaos#2957 ]

Alle reacties


  • vikterr
  • Registratie: februari 2017
  • Laatst online: 18-05 10:36
Probeer eens met !important erachter

[Voor 13% gewijzigd door vikterr op 10-10-2018 00:31]


Acties:
  • Beste antwoord
  • +1Henk 'm!

  • CH4OS
  • Registratie: april 2002
  • Niet online

CH4OS

It's a kind of magic

Probeer het eens met
Cascading Stylesheet:
1
2
3
.elementor-widget-container h5 {
    font-size: 40px;
}
in het CSS-bestand. Hiermee worden wel alle overeenkomsten vergroot, terwijl je misschien enkel de Recent Posts wilt, dan moet je die gewoon een eigen class meegeven zodat het door de CSS te selecteren is.

Overigens is element.style iets van de browser in de inspector. Dat geeft aan dat de styling toegapast is middels het style-attribuut van de tag en dat werkt dus alleen lokaal als je via de inspector het aanpast. ;) Je zult dus iets anders moeten hebben om het mee te selecteren, o.a. met bovenstaand kan dat. CSS werkt namelijk met classes en ID's, de classes worden aangeduid met een . in de CSS en de ID's met een #.

Wellicht is het dus ook een idee, als je het interessant vind, om een cursusje HTML en CSS te pakken?
Zodat eea duidelijker wordt en je niet als kip zonder kop aan de slag gaat? ;) Genoeg cursussen voor te vinden. Ik denk dat codecadamy.com dan wel een mooi begin is.
vikterr schreef op woensdag 10 oktober 2018 @ 00:31:
Probeer eens met !important erachter
De selector is niet goed, dus !important gebruiken gaat niet helpen. Important gebruiken is overigens ook het laatste wat ik altijd doe, important lijkt makkelijk, maar kan later voor kopzorgen zorgen, dat wil je echt zoveel mogelijk voorkomen tenzij het echt niet anders kan.

[Voor 74% gewijzigd door CH4OS op 10-10-2018 00:43]

[ Steam ][ Diablo ][ CptChaos#2957 ]


  • Frozen
  • Registratie: oktober 2010
  • Laatst online: 15:36

Frozen

2e Reviewer van het Jaar

Topicstarter
vikterr schreef op woensdag 10 oktober 2018 @ 00:31:
Probeer eens met !important erachter
Bedankt, maar helaas werkte het niet! :P
CH4OS schreef op woensdag 10 oktober 2018 @ 00:31:
Probeer het eens met
Cascading Stylesheet:
1
2
3
.elementor-widget-container h5 {
    font-size: 40px;
}
in het CSS-bestand. Hiermee worden wel alle overeenkomsten vergroot, terwijl je misschien enkel de Recent Posts wilt, dan moet je die gewoon een eigen class meegeven zodat het door de CSS te selecteren is.

Overigens is element.style iets van de browser in de inspector. Dat geeft aan dat de styling toegapast is middels het style-attribuut van de tag en dat werkt dus alleen lokaal. ;) Je zult dus iets anders moeten hebben om het mee te selecteren, o.a. met bovenstaand kan dat. CSS werkt namelijk met classes en ID's, de classes worden aangeduid met een . in de CSS en de ID's met een #.

Wellicht is het dus ook een idee, als je het interessant vind, om een cursusje HTML en CSS te pakken? Zodat eea duidelijker wordt en je niet als kip zonder kop aan de slag gaat? ;)


[...]
Important gebruiken is het laatste wat ik altijd doe, important lijkt makkelijk, maar kan later voor kopzorgen zorgen, dat wil je echt zoveel mogelijk voorkomen tenzij het echt niet anders kan.
Dankjewel, dat werkte inderdaad. Het enige probleem is dus nu, omdat eigenlijk alles in verschillende .elementor-widget-containers zit, dat alle "<h5>"-tags daardoor aangepast zullen worden. Hoe ik dat ga oplossen moet ik inderdaad dan nog even opzoeken, maar voorlopig is de makkelijkste oplossing die tag niet meer te gebruiken. Nu gebruikte ik die tag toch eigenlijk nooit maarja. :P

Een cursusje HTML en CSS is inderdaad handig, momenteel gebruik ik vooral guides wanneer ik problemen heb of ik zoek voorbeelden die ik dan aanpas en overtype. Echter was dit wel een vrij lastige aangezien dit meer een "grammatica"-issue is dan een woordenschat-issue.

Zo is het na 4 weken vragen op de Wordpress forums nog steeds niet gelukt om de websitenaam naast het websitelogo te krijgen, maar we zijn onderweg in ieder geval. :)

Bedankt voor de uitleg met betrekking tot de style-attribuut. d:)b

Voeg me gewoon toe op LinkedIn, iedereen is welkom!


  • CH4OS
  • Registratie: april 2002
  • Niet online

CH4OS

It's a kind of magic

Frozen schreef op woensdag 10 oktober 2018 @ 00:43:
Dankjewel, dat werkte inderdaad. Het enige probleem is dus nu, omdat eigenlijk alles in verschillende .elementor-widget-containers zit dat alle "<h5>"-tags daardoor aangepast zullen worden. Hoe ik dat ga oplossen moet ik inderdaad dan nog even opzoeken, maar voorlopig is de makkelijkste oplossing die tag niet meer te gebruiken. Nu gebruikte ik die tag toch eigenlijk nooit maar toch. :P
De betreffende tag een eigen class meegeven (of een id als het toch uniek is) en daar naar verwijzen in de CSS, dan wordt dus alleen die h5 gestyled. ;) Of anders het style-attribuut gebruiken, maar dan worden de properties in dat attribuut altijd gebruikt / overschreven. Dat krijgt een hogere prio voor CSS-begrippen.
Zo is het na 4 weken vragen op de Wordpress forums nog steeds niet gelukt om de websitenaam naast het websitelogo te krijgen, maar we zijn onderweg in ieder geval. :)
Dat is in de templates, heb ik zo 1 2 3 ook niet meer voor de geest, is lang geleden dat ik met WordPress templates bezig was. :+

EDIT:
Voor wat ik zo een twee drie kan vinden is wp_title(); de functie in PHP die je kan aanroepen in het WordPress thema om de titel van de site weer te geven. Al heeft deze functie wel ooit op de schietstoel gezeten, dus wellicht gaat dat in de toekomst weer gebeuren. ;)

[Voor 13% gewijzigd door CH4OS op 10-10-2018 00:53]

[ Steam ][ Diablo ][ CptChaos#2957 ]


  • Frozen
  • Registratie: oktober 2010
  • Laatst online: 15:36

Frozen

2e Reviewer van het Jaar

Topicstarter
CH4OS schreef op woensdag 10 oktober 2018 @ 00:46:
[...]
De betreffende tag een eigen class meegeven (of een id als het toch uniek is) en daar naar verwijzen in de CSS, dan wordt dus alleen die h5 gestyled. ;) Of anders het style-attribuut gebruiken, maar dan worden de properties in dat attribuut altijd gebruikt / overschreven. Dat krijgt een hogere prio voor CSS-begrippen.


[...]
Dat is in de templates, heb ik zo 1 2 3 ook niet meer voor de geest, is lang geleden dat ik met WordPress templates bezig was. :+

EDIT:
Voor wat ik zo een twee drie kan vinden is wp_title(); de functie in PHP die je kan aanroepen in het WordPress thema om de titel van de site weer te geven. Al heeft deze functie wel ooit op de schietstoel gezeten, dus wellicht gaat dat in de toekomst weer gebeuren. ;)
offtopic:
Ook dat is uiteindelijk gelukt. Mijn vorige post stond al een maand op de WP forums, maar zonder reactie. Gisteravond nogmaals gepost en nu wel een reactie! For future reference: https://wordpress.org/sup...t-to-title/#post-10767294 :)

Voeg me gewoon toe op LinkedIn, iedereen is welkom!


  • prakka
  • Registratie: oktober 2009
  • Nu online
Frozen schreef op woensdag 10 oktober 2018 @ 00:43:
[...]

Bedankt, maar helaas werkte het niet! :P


[...]

Dankjewel, dat werkte inderdaad. Het enige probleem is dus nu, omdat eigenlijk alles in verschillende .elementor-widget-containers zit, dat alle "<h5>"-tags daardoor aangepast zullen worden. Hoe ik dat ga oplossen moet ik inderdaad dan nog even opzoeken, maar voorlopig is de makkelijkste oplossing die tag niet meer te gebruiken. Nu gebruikte ik die tag toch eigenlijk nooit maarja. :P

Een cursusje HTML en CSS is inderdaad handig, momenteel gebruik ik vooral guides wanneer ik problemen heb of ik zoek voorbeelden die ik dan aanpas en overtype. Echter was dit wel een vrij lastige aangezien dit meer een "grammatica"-issue is dan een woordenschat-issue.

Zo is het na 4 weken vragen op de Wordpress forums nog steeds niet gelukt om de websitenaam naast het websitelogo te krijgen, maar we zijn onderweg in ieder geval. :)

Bedankt voor de uitleg met betrekking tot de style-attribuut. d:)b
Als je nog hulp nodig hebt met de titel, kan je mij altijd een pm sturen.

  • Frozen
  • Registratie: oktober 2010
  • Laatst online: 15:36

Frozen

2e Reviewer van het Jaar

Topicstarter
prakka schreef op woensdag 10 oktober 2018 @ 15:29:
[...]


Als je nog hulp nodig hebt met de titel, kan je mij altijd een pm sturen.
Dankjewel, maar het is opgelost. Zie ook:
Frozen schreef op woensdag 10 oktober 2018 @ 14:39:
[...]

offtopic:
Ook dat is uiteindelijk gelukt. Mijn vorige post stond al een maand op de WP forums, maar zonder reactie. Gisteravond nogmaals gepost en nu wel een reactie! For future reference: https://wordpress.org/sup...t-to-title/#post-10767294 :)

Voeg me gewoon toe op LinkedIn, iedereen is welkom!

Pagina: 1


Apple iPad Pro (2021) 11" Wi-Fi, 8GB ram Microsoft Xbox Series X LG CX Google Pixel 5a 5G Sony XH90 / XH92 Samsung Galaxy S21 5G Sony PlayStation 5 Nintendo Switch Lite

Tweakers vormt samen met Hardware Info, AutoTrack, Gaspedaal.nl, Nationale Vacaturebank, Intermediair en Independer DPG Online Services B.V.
Alle rechten voorbehouden © 1998 - 2021 Hosting door True