Wat betekenen vaste elementen in Tumblr?

De term "vaste elementen" in Tumblr verwijst naar elk object in je Tumblr-thema dat niet beweegt ten opzichte van het browservenster. Uw thema kan bijvoorbeeld een vaste zijbalk hebben. In dit geval beweegt de zijbalk niet wanneer u naar beneden scrolt; het blijft altijd op dezelfde plaats ten opzichte van het browservenster. Vaste elementen worden gedefinieerd in de Cascading Style Sheets-code van uw thema.

HTML en CSS

Alle Tumblr-thema's worden gedefinieerd door een combinatie van HTML en CSS. Over het algemeen bepaalt HTML de structuur van een thema, terwijl CSS de stijl dicteert. Veel websites hebben aparte HTML- en CSS-bestanden. De HTML en CSS van een typisch Tumblr-thema bestaan ​​echter samen in één uniforme broncode.

Uw thema-CSS vinden

Om de broncode van je thema te vinden, moet je inloggen op je Tumblr-account. Klik vanuit uw dashboard op het tandwielpictogram om het menu Instellingen te openen. Selecteer in het menu Instellingen de blog die je wilt bekijken. Klik in het blogaanpassingsmenu op 'Aanpassen' in het gedeelte Thema. Hiermee gaat u naar de pagina voor het aanpassen van het thema. Klik onder de titel van je thema op 'HTML bewerken'. Hiermee worden de HTML en CSS van uw thema weergegeven.

De functie: vast eigendom

Binnen de code van je thema kun je op "Ctrl-F" drukken om naar specifieke items te zoeken. Als u "positie: vast" in het zoekveld typt, kunt u door verschillende instanties van vaste elementen in uw thema bladeren. Als uw zoekopdracht geen resultaten oplevert of minder dan verwacht, probeer dan te zoeken naar "position:fixed" zonder spatie na de dubbele punt. Het element dat vast is, wordt genoemd vóór de "{" haak. #sidebar{position:fixed;} zou bijvoorbeeld een element repareren met de "sidebar" ID.

De elementen positioneren

Nadat de positioneringsmethode van een element is opgegeven, kunt u het met een bepaald aantal pixels langs de horizontale of verticale as verplaatsen. Om dit te doen, specificeert u de rand van de container van het element en het aantal pixels dat u het element van die rand wilt scheiden. Bijvoorbeeld #sidebar{position:fixed; boven: 20px; right: 10px;} plaatst de zijbalk 20 pixels vanaf de bovenkant van het browservenster en 10 pixels vanaf de rechterkant van het browservenster.

Vaste elementen wijzigen

Als u een vast element lokaliseert, kunt u de manier waarop het wordt gepositioneerd wijzigen. Het kenmerk "position:static" fixeert de positie van het element ten opzichte van zijn plaats in de stroom van de HTML-code. Dit attribuut wordt gebruikt om het element met een bepaalde hoeveelheid te compenseren ten opzichte van zijn normale statische positie. Bijvoorbeeld #zijbalk{positie: relatief; right:20px;} zou het #sidebar-element 20 pixels verschuiven van de normale rechterrand. Ten slotte verwijdert het kenmerk position:absolute het element uit de documentstroom en positioneert het ten opzichte van het bevattende element. Als een absoluut gepositioneerd element zich bijvoorbeeld binnen een relatief gepositioneerd element bevindt, zullen eventuele wijzigingen in de positie ervan plaatsvinden ten opzichte van het relatief gepositioneerde element. Je kunt met deze verschillende positioneringstypen experimenteren om aan te passen welke elementen in je Tumblr-thema zijn vastgezet.