English

html


Opdracht:
Wij moesten de kenmerken van een website op onze website zetten en wat is een website? en wat over wat een browser is

De kenmerken van een website zijn: Dat ze een back-end hebben en een front-end.
Een front-end is de layout van de website dat is 1 van de kenmerken.
De back-end is alles wat op de achtergrond van je website draait. Hiermee kan je checken de database.
Je beschijft ook waarvoor HTML en CSS voorstaat.
Html is de basis layout van de website het is eigenlijk een opmaak text. CSS is de layout voor de website waar je dus je pagina naar je eigen style kan maken.
Een website is bereikbaar via het netwerk zoals op het internet en je kan het ook prive zetten (local). Een publieke website vind je op het WWW world wide web. Een website word meestal gehost op een webserver.
Een browser is een middel / programma om te kunnen verbinden met het www (world wide web) dus te surven over het internet.
Ik heb ook een standaard layout van de HTML code:

Basislayout week 1

Opdracht:
Ik moet gaan vertellen over de webstructuur en vertellen wat het element "title". ik ga je ook de basis uitleggen over een element en tag

Een tag gebruikje om een bepaalde command op te roepen om een tag te gebruiken dan moet je beginnen met een "<" en eidigen met een ">".
om verduidelijking geven van een element en een tag hier onder staat eem foto.
element
Op een website heb je verschillende soort elementen een Head, body en een footer.
Een head vertel je de informatie van de website, zoals de titel van de website
De Body set je meestal de inhoud van de website. De head kan dat ook maar het is niet hoe het hoord.
De footer komt onder aan van je website en meestal staat daar je copyright mark en jouw persoonlijke informatie. De footer is niet verplicht om in je website te zetten.
Je gebruikt de Tag "title" om je titel aan te geven. De "title" tag word niet aan gegeven in de website, maar je ziet de titel boven in je tabalk. Het is meer de informatie voor je browser.

title week 2

Hier onder zie je hoe je het in je html file zet.

title week 2

Opdracht:
In deze opdracht ga Ik je vertellen hoe je links op je website zetten.

Om een link toe tevoegen gebruik je de tag "a". In de tag "a" gebruik je href="..." daar plaats je de link in van jouw website iemand andere website mail naar files to linken.
Om het even duidelijk te maken ga ik een voorbeeld laten zien over een link naar mijn email.
Link: Naar mijn email
ik ga vertellen hoe jij het handigst je mappen kan verdellen. maak eerst je index.html aan dan voor de aantal pagina's die je in de website gaat doen maak daar voor elk een map je aan en gebruik geen spacie of hoofdletter. en stop niet alles bij je home pagina.
hier onder ga ik mijn mappen structuur laten zien.
color

Link week 3

Opdracht:
In deze opdracht ga ik je laten zien hoe je een afbeelding in je website zet.

Je gebruikt de tag "img" img staat voor image met die tag kan je een afbeelding in je website zetten.
je moet in de "img" tag moet je src in zetten src staat voor source. Src gebruik je voor om je afbeelding te vinden. Je kan de foto van het internet afhalen en je kan het van je documenten halen.
klik hier voor uitleining van img.
Je kan ook meerde dingen tussen je img zetten je kan de width toevoegen de height en alt, alt is als de foto niet laad dan laad hij de text zien wat je hebt getyped en als je een reader hebt dan leest hij de alt text.
Ik laat 2 soorten voorbeelde laten zien in.

img week 4

Opdracht:
In deze opdracht ga Ik uitlegen wat het verschil is tussen "id" en "class" en ik leg uit over wat een stijlblad is en hoe je een css bestand oproept.

ID is een unique identiteit, je kan id met de zelfde naam kan je niet meerdere keer gebruiken het is net als een rijbewijs met het zelfde nummer dat kan niet en mag niet voorbeeld.
id informatie

Een class met de zelfde naam kan je meerdere keren gebruiken. Ik laat hier onder een voobeeld zien.
class informatie

Je gebruikt id om iets specfiek aan tegeven in je css file zodat je alleen die item die je een id geeft bijv een kleur geeft.
Nu ga ik uitlegen wat een styleblad is (css file). Eem css file gebruik je voor de opmaak van de website. css betekent Cascading Style Sheets.

Ik ga uitlegen op verschillende manier hoe je je css file kan oproepen.

Extern

Via extern dat doe je de tag "link"
extern informatie
"link" is een tag wat je gebruikt om externe files te linken en de recourse er vandaan kunnen hallen.
is het type" element is wat voor file hij moet gaan zoeken dus een css file "href" daar staat waar de plek van de css file staat.

Inline

Inline een voorbeeld staat hieronder.
inline informatie

Intern

Je kan het ook intern in je html file zetten met de tag "style" hieronder laat ik zien hoe het in ze werking gaat. Dat heeft de zelfde werking als een gewonnen css file.

intern informatie

Opdracht:
In deze opdracht ga Ik jullie uitleggen hoe je kleur verandert of hoe je de achtergrond kleur verandert of een afbeelding op de achtergrond doen.

Er zijn verschillende soorten manieren om kleuren aan te duiden Bijv voor hex code dat is dit "#fff" of RGBA dat betekent Red Green Blue Alpha (Alpha is official niet nodig is de dichtheid van de kleur). Er zijn nog manier om kleur aan te geven maar dat is echt de bekende.
rgb
Om de kleur te verandere van een text in css gebruikje "color: elk kleur die je wilt" ik laat even een voorbeeld zien.
color

Er is ook een background tag in css in dat kan je de achtergrond kleur verandere of een plaatje op de achter grond zetten je kan het ook positioneren als u op de link klikt kom je op een website waar ik het laat zien. klik hier voor de achtergrond kleur, klik hier voor de background image!!.
om je background steeds te laten herhalen gebruikje de command "background-repeat: repeat" in je css file.

Opdracht:
In deze opdracht ga ik je leren over font eigenschappen en line height, letter spacing, text-ident en Text-transform.

Je hebt Verschillende font eigenschappen zoals de eigenschap om de grote van een word / text te vergrooten dat doe je door.
size
ook kan je de letter type verandere door het volgende in je css te zetten.
font family
er is ook een code line van line height daar bepaal je de hoogte tussen de ene line en de andere line.
Er is ook letter-spacing code in css dat doet de ruimte tussen een letter en een andere word veranderen waar een spatie staat.
Er is een een Text-indent dat is een code line waarneer je begint van de zin in een text blok. Ik heb gelijk een laten zien als je het niet begrijp.

Dit is een dummy text daar laat ik zien

Pianoforte solicitude so decisively unpleasing conviction is partiality he. Or particular so diminution entreaties oh do. Real he me fond show gave shot plan. Mirth blush linen small hoped way its along. Resolution frequently apartments off all discretion devonshire. Saw sir fat spirit seeing valley. He looked or valley lively. If learn woody spoil of taken he cause. Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.

Opdracht:
Vertel het verschil tussen span en div en vertel wanneer je "id" "class" moet gebruiken. plaats een tabel. en hoe je een genummerde en niet genumerde text maakt. en leg uit hoe ik een tabel kop kan geven.

Wanneer je Id gebruikt is als je echt alleen dat ding wil editen en een class gebruik je om 1 of meerdere dingen te kunnen veranderen in je css file.
Het verschill tussen een div en een span, een span gebruik je voor in-line en voor wat kleinere chunk of code maar div is een block-inline en dat is meer bedoelt voor grote chunks of code.
Ik ga je uitleggen over overerving als jij je body een font-size van 10px geeft en je wil je paragraaf met de class test een font size van 11px maar je geeft het nergens aan dan b;ijft de font-size 10px pas als jij het in de css code zet dan geeft hij alle paragraaf met de class test een font-size van 11px.
En nu ga ik een tabel maken

collom 1 collom 2 collom 3
je gebruikt de tag "table", "tr","td"
je gebruikt de tag "table", "tr","td"
je gebruikt de tag "table", "tr","td"

Om een tabel te maken gebruik je de volgende tags een tabel algemeen te maken gebruik je
tabel
om collomen te maken gebruik je
tabel
de "th" is om een kop te geven aan de colom. "td" is om text in een tabel te zetten.
om een genummerde opsomming te maken gebruik je
  1. ol li tag
  2. daar mee
  3. gebruik je
  4. een genummerde opsomming

tabel

Opdracht:
leg uit hoe je een form maakt en wat het verschil is tussen method en action. en doe de volgende elemente uit. Keuzerondjes, Tekstregels, Tekstveld, Keuzemenu, Aankruisvakje, Verzendknop

First name:

Email:

text area:

kies een gender:
Male
Female
aanvalhelicopter
kies welke auto:


om een form gebruik je de "form" tag en om allemaal verschillende dingen er in moet zetten zoals een text input dat doe je "< input type="text">" ik laat een foto zien met comments van de form
tabel
Nu ga ik je vertellen wat het verschill is tussen method en action.
Action is Specike adress waar je linkt naar die page en de informatie naar toe stuurd.
method hier mee vertell je wat er met de informatie word gedaan.