Belangrijk: ComputerIdee Forum Huisregels | Wachtwoord vergeten?

Ga terug   Computer Idee Forum > Internet > Websites maken

Notices

Antwoord
 
Discussietools Weergave
Oud 17 January 2018, 17:06   #11
FooBar
 
FooBar's schermafbeelding
 
Geregistreerd: 21 May 2005
Locatie: Elders
Berichten: 14.072
Standaard

In dit geval gaat het niet om vaste waarden, maar 100vh staat voor "100% initial viewport height". 100vw logischerwijs voor hetzelfde, maar dan width. Ik werk zelf alleen maar in px, % of em, en had tot nu van vh en vw als eenheden nog nooit gehoord. Is iets (relatief) nieuws in CCS3 waar net zo goed voor geldt dat IE9 het niet snapt.

Afijn, dit specifieke geval doet niks voor een achtergrond, omdat het wordt toegepast op elementen met de klasse (class) "img". Die klasse heb jij vast niet aan je html of body tags toegekend. Heeft ook niet zo veel nut, want html en body zijn op zichzelf al uniek dus daar kun je gewoon naar verwijzen in je css zonder extra klasse.
En dan nog bepaalt het enkel de grootte van het element; het maakt het element dus net zo groot als de initiele grootte van het browservenster (durf niet te zeggen wat er gebeurt als je het browservenster verkleint of vergroot). Dat zegt dus niet hoe er met de achtergrond van het element omgegaan moet worden. Dat regel je ook dan nog steeds met background-attachment, background-size en eventueel background-repeat...

Iets heel anders is het om een afbeelding met img tag als achtergrond te gebruiken. Dit heb ik bij gebrek aan background-size ook wel eens gedaan, met een stukje javascript om het geheel de juiste afmeting te geven. Maar een puur CSS oplossing is altijd netter.

Als ik jou was zou ik als het nu werkt het lekker zo laten, zeker als het ook nog allemaal valid is.
FooBar is offline   Met citaat antwoorden
Oud 17 January 2018, 17:26   #12
BlackTiger
 
BlackTiger's schermafbeelding
 
Geregistreerd: 4 May 2005
Locatie: State Penitentiary
Berichten: 11.129
Standaard

Ja daarom schreef ik al dat ik -dacht- dat het om vaste waardes ging, nadat ik er over ben gaan lezen niet meer.
Maar ik zie de verschillen niet zo. Bomen en bos verhaal omdat ik er niet in thuis ben.

Ik zie meer dingen die relatief nieuw zijn in CSS maar die weer (of nog) niet door W3C geaccepteerd zijn.
Zo zitten deze dingen dus in CSS maar die worden door W3C validatie als warning aangemerkt en krijg je geen 100% validatie.
Code:
    -webkit-background-size: cover;
       -moz-background-size: cover;
         -o-background-size: cover;
Weet niet of deze je ook al bekend waren, maar anders nu wel.

Je uitleg brengt weer wat meer duidelijkheid. Ik associeer img nog te zeer met afbeelding.
Maar een klasse img is weer iets anders waar wel een afbeelding onder kan vallen, maar een afbeelding hoeft niet onder een img klasse te vallen. En daardoor is het in mijn geval niet van toepassing. Ik begrijp 't nu goed neem ik aan?
Zoiets maakt het voor de beginner weer wat moeilijker.

In mijn geval geen klasse img maar gewoon een achtergrond url als volgt:
Code:
background: url('../images/foto.jpg')
en dan helpt vh en vw dus niet begrijp ik uit jouw uitleg.

Bedankt voor de uitleg.
Zal 'm zeker laten staan zoals ik 'm had want het werkt perfect en alle pagina's zijn nu W3C validated.
__________________
Greetings, Black Tiger

-----------------------------
Domme vragen bestaan niet. Het is dom om een vraag te hebben en deze niet te stellen.

Laatst gewijzigd door BlackTiger : 17 January 2018 om 17:28
BlackTiger is offline   Met citaat antwoorden
Oud 17 January 2018, 22:25   #13
FooBar
 
FooBar's schermafbeelding
 
Geregistreerd: 21 May 2005
Locatie: Elders
Berichten: 14.072
Standaard

De -webkit-, -moz-, -o- prefixen worden door browsermakers gebruikt als ze iets implementeren wat nog geen officiele standaard is. Kun je er alvast mee stoeien zeg maar. Inmiddels is background-size wel standaard en hoeft de prefix niet meer, tenzij je een aantal oude browserversies wil blijven ondersteunen. Zie https://developer.mozilla.org/en-US/..._compatibility

Volgens mij snap je het verhaal over klasses, al is je bewoording niet helemaal zuiver. Misschien helpt dit nog voor de zekerheid: img { ... } in css is van toepassing op alle<img ...> in html. Er is in dit geval geen klasse. In css worden klassen voorafgegaan door een punt. Dus .img { ... } is van toepassing op alle <... class="img" ...> in de html, dus wel op <img class="img" ...> maar niet op <img class="watanders" ...> en ook niet op een <img> zonder class. Maar weer wel op <div class="img">, wat misschien helemaal niks met een afbeelding heeft.
Tip: gebruik geen namen van bestaande html tags als naam voor een klasse, dat geeft alleen verwarring.
FooBar is offline   Met citaat antwoorden
Oud 18 January 2018, 00:26   #14
BlackTiger
 
BlackTiger's schermafbeelding
 
Geregistreerd: 4 May 2005
Locatie: State Penitentiary
Berichten: 11.129
Standaard

Citaat:
De -webkit-, -moz-, -o- prefixen worden door browsermakers gebruikt als ze iets implementeren wat nog geen officiele standaard is.
Niet alleen browsermakers. Ik kwam het namelijk tegen in Osticket, een open source ticket systeem.
De background-size is inderdaad wel standaard maar die anderen wil w3c niet.

Phew... het is inderdaad wel goed dat je dit nog even voor de zekerheid erbij vertelde. Ik begrijp 'm wel, maar dit is dan alleen nog voor img en img classes. Da's maar 1 ding, een afbeelding.
Ben echt blij dat ik geen webdesigner ben. Maar het is wel leuk om stukjes te leren en eens te kunnen terugzoeken als ik eens iets aan het proberen ben en dan komt dit wat ik nu leer wel van pas.
Want ik dacht dat classes alleen iets voor css files was, totaal geen idee dat er ook zoiets in html bestond.
__________________
Greetings, Black Tiger

-----------------------------
Domme vragen bestaan niet. Het is dom om een vraag te hebben en deze niet te stellen.
BlackTiger is offline   Met citaat antwoorden
Oud 19 January 2018, 21:40   #15
FooBar
 
FooBar's schermafbeelding
 
Geregistreerd: 21 May 2005
Locatie: Elders
Berichten: 14.072
Standaard

Citaat:
Oorspronkelijk geplaatst door BlackTiger Bekijk bericht
Niet alleen browsermakers.
Oh, zo bedoelde ik 'm niet. Ik bedoelde dat browsermakers nog-niet-officiele css-regels al eerder beschikbaar maken dan dat deze door W3C zijn vastgesteld in een standaard. Dan voegen ze zo'n prefix toe om aan te geven dat het gebruik op eigen risico is, maar daardoor kun je het dus wel al uitproberen. Kans bestaat dat een css-regel met zo'n prefix nog wijzigt of misschien zelfs weer verdwijnt.

Citaat:
Oorspronkelijk geplaatst door BlackTiger Bekijk bericht
Want ik dacht dat classes alleen iets voor css files was, totaal geen idee dat er ook zoiets in html bestond.
Nee, zeker ook in html. Daar gebruik je het om de juiste css-regels aan je element te knopen. En tegenwoordig ook voor allerlei javascript-gerelateerde aangelegenheden.
FooBar is offline   Met citaat antwoorden
Antwoord

Discussietools
Weergave

Regels voor berichten
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is Aan
Smileys zijn Aan
[IMG]-code is Aan
HTML-code is Uit

Forumnavigatie


Alle tijden zijn GMT +1. Het is nu 08:39.


Powered by vBulletin Version 3.8.6
Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.