[HTML] Inspringen

[Verwijderd]

Hallo,

Ik zit met een simpel probleem, maar omdat ik niet al te veel HTML-ervaring en -kennis heb, vraag ik het even aan jullie.

Hoe kan ik het beste tekst naar rechts laten inspringen? Ik wil dus iets zoals dit:

dit is een tekst bla bla bla
nog wat tekst op hetzelfde niveau
..een niiveau dieper
..en we blijven hier
....nog eentje dieper!
..terug op tweede niveau
terug in root

Het grote probleem is dat ik in het begin niet weet hoeveel niveaus ik ga hebben (de hele site wordt geparset), dus mijn standaard-oplossing gaat niet werken denk ik: maak voor elk niveau dieper een 'dummy kolom' van een handvol pixels breed met lege tekst aan. (de colspan van niveaus hoger wordt dus verhoogd)

Hoe kan ik dit het beste aanpakken? Ik kan numbering gaan gebruiken (<ol> en <li> stuff), maar dit lijkt mij niet geschikt? Ik ben al wat op zoek geweest, maar zoals ik al zei, zoveel ervaring heb ik niet, dus ik weet niet goed op wat ik allemaal moet en kan zoeken.

Bedankt!

[coubertin119]

Met classes verschillende niveau's toewijzen, en met text-ident je alinea'tjes laten inspringen. Waarom klooien met tables voor zoiets?

Of lijstjes, als dit de betekenis van je inspringingen is .

[ Voor 23% gewijzigd door coubertin119 op 17-02-2004 20:51 ]

[Civil]

waarom lijkt een unordered list <ul> ipv een ordered list <ol> je daarvoor niet geschikt. Juist deze list-tags zijn gemaakt om lijsten te maken die insprinken.

code:

<ul>
     <li> ... Level one, number one...</li>
     <li> ... Level one, number two...</li>
     <ul> 
        <li> ... Level two, number one...</li>
        <li> ... Level two, number two...</li>
        <ul> 
           <li> ... Level three, number one...</li>
        </ul> 
        <li> ... Level two, number three...</li>
     </ul> 
     lil> ... Level one, number three...</li>
</ul>

[ Voor 59% gewijzigd door Civil op 17-02-2004 20:56 ]

[Thomasje]

<blockquote></blockquote>

Dat gebruiken ze hier ook bij de quote

[Verwijderd]

Inspringen is lay-out.
Layout doen we tegenwoordig niet met HTML maar met CSS.

HTML:

<div class="myClass">
    Lorem

    <div class="myClass">
        Ipsum

        <div class="myClass">
            Dolor
        </div>
    </div>
    <div class="myClass">
        Sit
    </div>
    <div class="myClass">
        Amet
    </div>
</div>

<style="text/css">
.myClass { padding-left:3em; }
</style>

Geeft zoiets:

code:

   Lorem
      Ipsum
         Dolor
      Sit
      Amet

Maar voordat je met DIVs gaat strooien (alsjeblieft niet met TD, colspan, en dergelijke), kijk eerst eens naar het soort content wat je beschrijft. Zijn het paragrafen? Lijsten? Headers?

Beschrijf je content eens wat meer, dan kunnen we je beter helpen.

Thomasje schreef op 17 februari 2004 @ 20:50:
<blockquote></blockquote>

Dat gebruiken ze hier ook bij de quote

Dat is dus eigenlijk niet de bedoeling.

[Spider.007]

Thomasje schreef op 17 februari 2004 @ 20:50:
<blockquote></blockquote>

Dat gebruiken ze hier ook bij de quote

quote: http://webdesign.about.co...ags/bltags-blockquote.htm

The <blockquote></blockquote> element is deprecated in favor of style sheets when used to indent text.

Verwijderd schreef op 17 februari 2004 @ 20:53:
Inspringen is lay-out.
Layout doen we tegenwoordig niet met HTML maar met CSS.

HTML:

<div class="myClass">
    Lorem

    <div class="myClass">
        Ipsum

        <div class="myClass">
            Dolor
        </div>
    </div>
    <div class="myClass">
        Sit
    </div>
    <div class="myClass">
        Amet
    </div>
</div>

<style="text/css">
.myClass { padding-left:3em; }
</style>

Geeft zoiets:

code:

   Lorem
      Ipsum
         Dolor
      Sit
      Amet

Maar voordat je met DIVs gaat strooien (alsjeblieft niet met TD, colspan, en dergelijke), kijk eerst eens naar het soort content wat je beschrijft. Zijn het paragrafen? Lijsten? Headers?

Beschrijf je content eens wat meer, dan kunnen we je beter helpen.


[...]

Dat is dus eigenlijk niet de bedoeling.

toon volledige bericht

Met hierbij de opmerking dat deze input

HTML:

<div class="myClass">Lorem<div class="myClass">Ipsum<div class="myClass">Dolor</div>
</div><div class="myClass">Sit</div><div class="myClass">Amet</div></div><style="text/css">
.myClass { padding-left:3em; }
</style>

hetzelfde gevolg heeft

[ Voor 82% gewijzigd door Spider.007 op 17-02-2004 20:56 ]

[Verwijderd]

Wil je het echt slordig maar effectief doen dan gebruik je gewoon & nbsp; met de spatie weg tussen de & en n.

[Spider.007]

[dubbel]

[ Voor 100% gewijzigd door Spider.007 op 17-02-2004 20:56 ]

[Verwijderd]

Oké heel erg bedankt allemaal, hiermee kan ik echt verder

Ik moet toegeven, ik maak zelden sites, maar ik wil het wel zo goed mogelijk doen. Deze keer ism. CSS dus

Ik ga het op de manier van Blues of Civil doen, komen allebei eigenlijk op hetzelfde neer.

Blues: in principe zijn het gewoon secties die onderdeel zijn van een bovenliggen sectie, met eventueel een titel. Heel algemeen dus; paragrafen kan je zeggen. Een genummerde lijst is het dus allezins niet.

[Spider.007]

Verwijderd schreef op 17 februari 2004 @ 21:00:
Oké heel erg bedankt allemaal, hiermee kan ik echt verder

Ik moet toegeven, ik maak zelden sites, maar ik wil het wel zo goed mogelijk doen. Deze keer ism. CSS dus

Ik ga het op de manier van Blues of Civil doen, komen allebei eigenlijk op hetzelfde neer.

Blues: in principe zijn het gewoon secties die onderdeel zijn van een bovenliggen sectie, met eventueel een titel. Heel algemeen dus; paragrafen kan je zeggen. Een genummerde lijst is het dus allezins niet.

Doe iedereen een plezier en zorg ervoor dat je site door deze validator heenkomt Dat scheelt weer een IE only site

[Verwijderd]

Spider.007 schreef op 17 februari 2004 @ 21:02:
[...]


Doe iedereen een plezier en zorg ervoor dat je site door deze validator heenkomt Dat scheelt weer een IE only site

Doe ik meestal, maar een site die erdoor komt wil nog niet zeggen dat die site 'netjes' is gemaakt

[Verwijderd]

Verwijderd schreef op 17 februari 2004 @ 21:00:
Blues: in principe zijn het gewoon secties die onderdeel zijn van een bovenliggen sectie, met eventueel een titel. Heel algemeen dus; paragrafen kan je zeggen. Een genummerde lijst is het dus allezins niet.

Doe iedereen een lol, gebruik dan ook de P tag.

Let wel: P tags mogen alleen inline elementen bevatten (SPAN, A, etc.), dus die mogen niet genest worden.

HTML:

<div class="Section">
    <!-- hoofdsectie -->
    <h1>Hoofdtitel</h1>
    <p>Je tekst...</p>
    <p>Meer tekst...</p>

    <!-- subsectie -->
    <div class="Section">
        <h2>Subtitel</h2>
        <p>Je tekst...</p>
        <p>Meer tekst...</p>

        <!-- subsubsectie -->
        <div class="Section">
            <h3>Subsubtitel</h3>
            <p>Je tekst...</p>
            <p>Meer tekst...</p>
        </div>

    </div>

</div>

[Verwijderd]

Verwijderd schreef op 17 februari 2004 @ 21:12:
[...]

Doe iedereen een lol, gebruik dan ook de P tag.

Let wel: P tags mogen alleen inline elementen bevatten (SPAN, A, etc.), dus die mogen niet genest worden.

Zal er aan proberen te denken!

[Verwijderd]

Voor degene die met het lijstvoorbeeldje kwam, erg leuk natuurlijk, maar UL>UL is invalid HTML ;-)

[Willem]

HTML:

<dl>
  <dt>abc</dt>
    <dd>1234</dd>
  <dt>def</dt>
    <dd>456</dd>
</dl>