afbeeldingen plaatsen, moeite er mee.

Status
Niet open voor verdere reacties.

Hannes57

Gebruiker
Lid geworden
23 apr 2016
Berichten
173
Hallo,

Ik ben bezig met een simpele website over mijn hobby, nml. modelbouw. Heb een template en deze met een editor wat aangepast.
Op de home pagina wil ik een afbeelding plaatsen rechts onder, boven de Footer. Moet ik een nieuwe div aanmaken voor deze afbeelding? CSS regel maken etc.

Ook wil ik een afbeelding pagina maken met 6 tot 8 foto's
Deze wil ik onder een stukje tekst plaatsen. Mijn vraag is : moet ik 8 div' aanmaken en deze dan een afzonderlijke naam geven. Bijv. Div foto1 etc.
De afbeelding geeft aan waar de foto's moeten komen. De tabellen met namen worden dan verwijderd. Dus onder Vliegtuigen komt iets tekst en de foto's.
Schermafdruk_2018-07-21_15-26-16.png

Site: XHTML 1 Trans.
Editor: Kompozer (source) en Bluefish
OS: Xubuntu 18.04LTS
Noot: bijlage TXT veranderen in html en css. Anders kon ik geen bijlage versturen.

Ik hoop op wat hulp.

Han.
 

Bijlagen

  • index.txt
    2,5 KB · Weergaven: 37
  • styles.txt
    1,9 KB · Weergaven: 43
Hoi, in de bijlage jouw pagina met daarin 1) hoe je een afbeelding rechts of links in je tekst kan zetten en 2) hoe je een thumb foto matrix maakt.
Suc6. Have fun.
 

Bijlagen

  • images.zip
    2,5 KB · Weergaven: 39
bron,

dank je wel voor je reactie. Ga het uitproberen. Nog iets. Is XHTML moeilijker dan HTML5?

han
 
In de tijd gezien kreeg je na html4 > xhtml > html5. Met andere woorden, xhtml is niet meer van deze tijd en je kan beter direct overgaan op html5. Html5 is niet moeilijker dan xhtml. Bij webpagina's is de css het lastige deel voor beginners. De html5 tags (zoals nav, main, figure, enz.) kan je gebruiken als een div. In de bijlage jouw pagina in html5 en de css heb ik iets geoptimaliseerd. Als je een vraag hebt hoor ik het wel :)
 

Bijlagen

  • images2.zip
    5,2 KB · Weergaven: 35
Laatst bewerkt:
Bron,

Heel veel dank voor jouw moeite die je er in hebt gestoken.Ik kijk veel op W3Schools en,idd., alles is in HTML5. De CSS vindt ik echt moeilijk en rot. Maar ja, ouderdom....:D

Jammer dat W3schools alleen in het engels is, een simpele uitleg , liefst in het NL, is toch echt handig. Maar ja, ik ga eens kijken en uitproberen.

Han
 
Bron

Geweldig. Het is mij gelukt om er een afbeelding, van mijzelf gemaakt model, er in te zetten. Voorlopig in xhtml.
Maar....Hoe vergroot ik de afbeelding?
Ik neem aan met CSS en met welk atribuut/selector?

Maar goed, het begin is er. Nogmaals dank en moeite.

Han
 
Mijn advies is niet verder te gaan met xhtml, voorbeelden op internet zijn allemaal voor html5. In de bijgewerkte bijlage "images3a" vind je alle voorbeelden van alles wat je nu gebruikt. Het is een kwestie van een html voorbeeld op de goede plek in de html zetten, meer niet. De css hoef je dan even niet over na te denken, daar kan je je later in verdiepepn.

Zowel een id als een class verwijzen naar de css waarin je ze terugvind als #naam en .naam
Een id="..." mag maar 1x worden gebruikt op een pagina! Daarom wordt dit alleen gebruikt voor de hoofd-structuur.
Een class="..." mag je meerdere keren op een pagina gebruiken, die zijn dus veel handiger.

In de css heb ik een aantal class'es gemaakt die je als class="..." in de html kan/mag gebruiken, bijvoorbeeld
Code:
<p class="clearfix">
<img class="w20 float-right" src="mijnfoto.jpg" alt="" />
Hier staat tekst. Hier staat tekst. Hier staat tekst.
</p>
Het resultaat hier is een afbeelding van 20% breed (t.o.v. de totale breedte), rechts opgelijnd en links wat tekst.
De uitleg van clearfix, w20 en float-right staat in styles.css.

Nadat je iets hiermee in de html hebt gemaakt merk je hoe makkelijk het gebruik ervan is.
Laat even weten of je iets aangepast wilt hebben, of een vraag erover hebt?

Suc6 weer.

* Dit is iets (klik) in het Nederlands maar je moet er dan wel de tijd voor nemen :)
 

Bijlagen

  • images3a.zip
    2,6 KB · Weergaven: 43
Laatst bewerkt:
Bron

Dank voor alles. Ik heb, gisteren ondanks het mooie, warme weer (Kamer is lekker koel), veel gekeken naar je voorbeelden. Ik heb eerst de xhtml site gedaan en dat is gewoon mooi gelukt. Als je door hebt hoe het werkt dan is een WYSIWYG, eigenlijk niet zo mooi. Dus alle gedaan in de bron. Plaatjes van het net gehaald en die er in gezet met text etc. Ik ben tevreden,de kleur blauw, aangepast naar donker rood.Misschien Em nog aanpassen naar Px.

Han
 
Status
Niet open voor verdere reacties.
Steun Ons

Nieuwste berichten

Terug
Bovenaan Onderaan