Archief - links zijn dood?

jokke0066 · 21 jun 2010

Jonathan zei:
Ge zijt er mee aant lachen hé ...

Ge zegt zelf dat ge op W3schools.com zit, dus als ge daar gewoon op "CSS" klikt en dan op" CSS how to" krijgt ge daar direct de uitleg die ge nodig hebt.

External stylesheets zijn good practice omdat ze alles overzichtelijker houden.

Zelfredzaamheid is één van de belangrijkste eigenschappen van een webdesigner/developer.
Verder meen ik ook dat iemand die wil ontwerpen voor het web eerst moet overweg kunnen met het web ... dus gebruik het

srry maar ik was nog met andere dingen bezig en ik dacht kzal het snel vrage

ben momenteel een youtube filmpje aant bekijken hoe ik men css net moet integreren in html

jokke0066 · 22 jun 2010

HTML:

<table border="1">
<tr>
<th width="800px">Minitheatra: en nieuw begin</th>
<th width="100px">Menu</th>
</tr>
<tr>
<td>
Iedereen die onze vereniging op de voet volgt weet dat
Minitheatra begin dit jaar zware klappen kreeg. We verloren niet
enkel onze voorzitter en goede vriend Dr&eacute;, maar ook onze
locatie om op te treden.<br><br> Maar, na een korte rustpauze zijn we
weer helemaal terug, versterkt met nieuwe mensen, een nieuwe
locatie en een nieuw concept!<br><br> Minitheatra streeft er naar om
anders te blijven dan de anderen en gaan u daarom meenemen naar
avond gevuld met natuurlijk toneel, maar ook zang, dans en
muziek!
</td>
<td>
<a href="http://www.minitheatra.be/index.htm">home</a><br>
<a href="http://www.minitheatra.be/Hoe%20het%20begon.htm">hoe het begon</a><br>
<a href="http://www.minitheatra.be/Wie%20zijn%20wij.htm">Wie zijn wij?</a>
</td>
</tr>
</table>

dit is men html code van men table maar hoe kan ik de style hiervan in men css bestand zetten is dat dan <table id=""> of met de div tag?

Blaaaa · 22 jun 2010

Je kan dit gewoon op je table element doen zoals jezelf aangeeft (je kan elk html element een id en/of class meegeven).
Wat meer uitleg over id en class: CSS Id and Class

kaketoe · 22 jun 2010

kaketoe zei:
- geen <table> gebruiken voor de opbouw van uw website, gebruik <div> en CSS.

Of ge kunt ook niets lezen van wat ik schrijf natuurlijk... :ironic:

jokke0066 · 22 jun 2010

kaketoe zei:
Of ge kunt ook niets lezen van wat ik schrijf natuurlijk... :ironic:

dat had ik ook wel gelezen, maar hoe dan?

Curahee Q · 22 jun 2010

Gebruik elk element waarvoor het gemaakt is. Tables zijn gemaakt voor tabulaire data, niet voor het design.

jokke0066 zei:
dat had ik ook wel gelezen, maar hoe dan?

Je moet natuurlijk ook het stukje na de komma lezen.

----------------------------
Over het toevoegen van css style aan een element.
Dit kan op 2 manieren. Via het class atribuut (wordt meestal gebruikt) of via het id attribuut. Je mag het id attribuut enkel gebruiken als je slechts 1 keer deze style gebruikt op de pagina, anders moet het met class.

Class voorbeeld

Code:

div.element {
       height: 20px;
       background: red;
}

Code:

<div class="element">
       tekst
</div>

De . (punt) in de css duidt op class.

Id voorbeeld

Code:

div#element {
       height: 20px;
       background: red;
}

Code:

<div id="element">
       tekst
</div>

Het # in de css duidt op id.

jokke0066 · 22 jun 2010

ok bedankt voor de duidelijke uitleg

kzit dan wel met een ander vraagje. Hoe kan ik de <table> tag dan vervangen door <div> wat moet er dan in men ccs staan voor z'n tabel?

Curahee Q · 23 jun 2010

VERGEET een table.

Een div is evenveel een table als dat een brood een taart is. Het zijn 2 aparte dingen dus moeten ze ook anders worden aangemaakt/geinitialiseerd.
Zoek een deftige tutorial over div's op het internet en je komt al een heel eind ver. Probeer niet zo maar dat tabulaire design om te zetten naar div's. Het beste is gewoon opnieuw beginnen en niet meer naar de code van het oude design. Tracht het nieuwe design hetzelfde te krijgen als het oude design.

jokke0066 · 23 jun 2010

ok ik zal een zoeken naar een goede tuto

jokke0066 · 23 jun 2010

Ok, als ik het goed begrijp moet ik dus elke tekst tussen de <div> tag zette en dan steeds een "border" geven?

kaketoe · 23 jun 2010

In HTML zijn er de zgn. "box" elementen. Dit zijn oa. div, p, li, ...
En op die box elementen kan je bepaalde afmetingen geven (in absolute waarden (px) of relatieve waarden (em), verder kan je ook nog percentages opgeven, maar die zijn doorgaans bijzonder ingewikkeld)

Hou dit gewoon in gedachten:
- margin is de plaats tussen de "parent" box en de huidige box
- border is de rand rond de padding van de huidige box
- padding is de rand rond de inhoud van de huidige box (hetgeen je tussen de tags zelf hebt geschreven)

Hier even in afbeeldingvorm:
http://escience.anu.edu.au/lecture/comp1710/CSS/image/boxdim.png

Dit is misschien nog nét iets te theoretisch, maar als je wat googlet op de individuele trefwoorden van hierboven kom je er wel denk ik.

jokke0066 · 23 jun 2010

kaketoe zei:
In HTML zijn er de zgn. "box" elementen. Dit zijn oa. div, p, li, ...
En op die box elementen kan je bepaalde afmetingen geven (in absolute waarden (px) of relatieve waarden (em), verder kan je ook nog percentages opgeven, maar die zijn doorgaans bijzonder ingewikkeld)

Hou dit gewoon in gedachten:
- margin is de plaats tussen de "parent" box en de huidige box
- border is de rand rond de padding van de huidige box
- padding is de rand rond de inhoud van de huidige box (hetgeen je tussen de tags zelf hebt geschreven)

Hier even in afbeeldingvorm:
http://escience.anu.edu.au/lecture/comp1710/CSS/image/boxdim.png

Dit is misschien nog nét iets te theoretisch, maar als je wat googlet op de individuele trefwoorden van hierboven kom je er wel denk ik.

tgeen je hier zegt snap ik al een beetje met de margin en padding en zo ik denk dat ik wel op de juiste weg ben maar ik krijg op geen manier 2 kaders naast elkaar ik heb al geprobeert met "display: inline;" maaar het lukt me niet

kaketoe · 23 jun 2010

2 kaders gaat perfect:

Voer dit uit in je browser:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
   <HEAD>
      <TITLE>Html document</TITLE>
      <STYLE>
      div {
        width: 150px;
      }
      .div1 {
        /*display:inline;*/
        
      }
      .div2 {
        /*display:inline;*/
      }
      </STYLE>
   </HEAD>
   <BODY>
      <div class="div1">
      div1
      </div>
      <div class="div2">
      div2
      </div>
   </BODY>
</HTML>

En haal dan eens de commentaar weg in de CSS (/* en */ wegdoen)

En doe dan eens refresh.
QED (toch in firefox)
De default value van een box element is inderdaad display:block, en dan genereert elk box element een breakline na de tag. display:inline gaat dat tegen.

jokke0066 · 23 jun 2010

het werkt EINDELIJK

zkit dan alleen met het volgende probleem xD nu word de border aangepast naar de grote van het woord maar die zou zo grote die ik heb ingesteld.

kaketoe · 23 jun 2010

jokke0066 zei:
het werkt EINDELIJK
zkit dan alleen met het volgende probleem xD nu word de border aangepast naar de grote van het woord maar die zou zo grote die ik heb ingesteld.

Dat ga je toch even moeten herformuleren vrees ik.

Je hebt de grootte van de border (tussen de margin en de padding) ingesteld, en hoe is dat precies gerelateerd aan de grootte van uw letters? :eek:

YaMo · 23 jun 2010

Het beste hier lijkt mij gewoon alles wat je denkt te weten over CSS en HTML vergeten en van 0 beginnen met tutorials van bijvoorbeeld w3schools.

jokke0066 · 23 jun 2010

YaMo zei:
Het beste hier lijkt mij gewoon alles wat je denkt te weten over CSS en HTML vergeten en van 0 beginnen met tutorials van bijvoorbeeld w3schools.

ik werk met w3school en vanaf 0 beginnen heb ik al gedaan.

jokke0066 · 23 jun 2010

kaketoe zei:
Dat ga je toch even moeten herformuleren vrees ik.

Je hebt de grootte van de border (tussen de margin en de padding) ingesteld, en hoe is dat precies gerelateerd aan de grootte van uw letters?

Code:

div.linkerkolom{
	width: 750px;
	border:2px solid;
	display: inline;
}

div.rechterkolom{
	width: 150px;
	border:2px solid;
	display: inline;
}

dit zijn de 2 kolomen die ik naast elkaar wil de 1ne met 750px:width en de 2e met 150px:width
begrijp je het?

jokke0066 · 23 jun 2010

kep het al gevonden kmoest gewoon "inline-table" gebruiken in plaats van "inline"

jokke0066 · 23 jun 2010

kzit weeral met een volgend vraagje maar dan is men homepage bijna af.
hoe kan ik tekst naast een foto zetten?

nu komt de tekst:
___________
|-----------|
|-----------|
|----foto---|MAAR ik wil de tekst hier
|-----------|
|__________|hier staat men tekst dan

is het zo duidelijk uitgelegd

Archief - links zijn dood?

jokke0066

Legacy Member

jokke0066

Legacy Member

Blaaaa

Legacy Member

kaketoe

Legacy Member

jokke0066

Legacy Member

Curahee Q

Legacy Member

jokke0066

Legacy Member

Curahee Q

Legacy Member

jokke0066

Legacy Member

jokke0066

Legacy Member

kaketoe

Legacy Member

jokke0066

Legacy Member

kaketoe

Legacy Member

jokke0066

Legacy Member

kaketoe

Legacy Member

YaMo

Legacy Member

jokke0066

Legacy Member

jokke0066

Legacy Member

jokke0066

Legacy Member

jokke0066

Legacy Member