html in code tabel met behulp van css - Softwareontwikkeling

donderdag 20 oktober 2005 12:15

Acties:

Verwijderd

Topicstarter

Goeie morgen,

Ik heb even een vraagje, als ik in dit forum een stukje code wil posten bijvoorbeeld html of php kan ik gebruik maken van zo'n code tabelletje waar dan de code netjes instaat en de code ook gewoon leesbaar is,en door de browser ook niet wordt herkent als code, maar gewoon als tekst. Nu wil ik dat op mijn site ook doen, en nu heb ik begrepen dat dit ook mogelijk is door gebruik te maken van een class met bepaalde iegenschappen in je css, heeft iemand enig idee hoe ik dit kan doen?

Alvast bedankt,

donderdag 20 oktober 2005 12:18

Acties:

dominic

will code for food

Enkel met CSS attributen is dit niet mogelijk, je zult een HTML element moeten gebruiken die zijn innerHTML (Waar je de 'code' inzet) niet moet renderen. Dit element voorzie je dan weer van de juiste opmaak via css..

[ Voor 6% gewijzigd door dominic op 20-10-2005 12:18 ]

Download my music on SoundCloud

donderdag 20 oktober 2005 12:24

Acties:

Verwijderd

Topicstarter

Oke duidelijk, heb je enig idee hoe dat moet, of waar ik een goede tutorail of voorbeeld kan vinden, want ik heb geen id hoe dat moet?

donderdag 20 oktober 2005 12:39

Acties:

BtM909

Watch out Guys...

Wat wil je nou precies bereiken?
[nohtml]

HTML:

1
2
3

<body>
  <p>blabla</p>
</body>

dus gewoon een kader met tekst erin

of

Cascading Stylesheet:

1
2
3

#something{
  border: 1px solid red;
}

dus met kleurtjes er meteen bij?[nohtml]

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.

donderdag 20 oktober 2005 12:40

Acties:

RobIII

Admin Devschuur®

^ Romeinse Ⅲ ja!

Probeer gewoon de <pre> tag eens:

<pre>
Je...
Code...
Hier...
</pre>

Dan ben je denk ik al een heel eind

V V V Oh, en wat hij zegt natuurlijk V V V

[ Voor 45% gewijzigd door RobIII op 20-10-2005 12:42 ]

There are only two hard problems in distributed systems: 2. Exactly-once delivery 1. Guaranteed order of messages 2. Exactly-once delivery.

Je eigen tweaker.me redirect

Over mij

donderdag 20 oktober 2005 12:41

Acties:

T-MOB

Je zou bijvoorbeeld kunnen kijken hoe dat op GoT wordt gedaan

.
Een element dat zijn innerHTML niet rendered ken ik overigens niet. De truc is om de karakters die code voorstellen om te zetten in entities. In plaats van "<" zet je dus < neer. Om whitespace-karakters correct te houden kun je een <pre> tag gebruiken, of in CSS regelen dat dit in het semantische correctere <code> element gebeurt

Regeren is vooruitschuiven

donderdag 20 oktober 2005 12:51

Acties:

Verwijderd

Topicstarter

BtM909 schreef op donderdag 20 oktober 2005 @ 12:39:
Wat wil je nou precies bereiken?
[nohtml]
HTML:
1
2
3
<body>
  <p>blabla</p>
</body>
dus gewoon een kader met tekst erin

of
Cascading Stylesheet:
1
2
3
#something{
  border: 1px solid red;
}
dus met kleurtjes er meteen bij?[nohtml]

Ik wil gewoon een kader met html erin wat als tekst wordt weergeven, kleurtjes enz is niet nodig, zoals jou eerste voorbeeld!

donderdag 20 oktober 2005 12:57

Acties:

Verwijderd

Topicstarter

T-MOB schreef op donderdag 20 oktober 2005 @ 12:41:
Om whitespace-karakters correct te houden kun je een <pre> tag gebruiken, of in CSS regelen dat dit in het semantische correctere <code> element gebeurt

Hoe regel ik dan CSS dat dit in het semantische correctere <code> element gebeurt?

donderdag 20 oktober 2005 13:01

Acties:

T-MOB

white-space, die had je zelf toch best kunnen vinden?

Regeren is vooruitschuiven

donderdag 20 oktober 2005 13:06

Acties:

Verwijderd

Topicstarter

je hebt gelijk, het was me nog niet helemaal duidedlijk!

donderdag 20 oktober 2005 13:21

Acties:

Verwijderd

Topicstarter

oke ik heb het nu zo gedaan en het werkt nog steeds niet. In mijn style sheet heb ik dit erbij gezet:

code:

.code {
    white-space: pre;
    font-size: 10px; 
    color: orange;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-weight: bold;
    background-color: #afc6db;
    margin: 0;
    padding: 0; 
}

en dit in mijn webpagina:

code:

<p class="code">
&lt;html&gt;
&lt;head&gt;
&lt;/head&gt;
&lt;body&gt;
blahblahblahblah
&lt;/body&gt;
&lt;/html&gt;
</p>

En het enigste wat ik steeds te zien krijg is dat blahblahblah, dus de browser herkent de tekst nog steeds als html

donderdag 20 oktober 2005 13:43

Acties:

T-MOB

Jouw code doet het bij mij anders perfect: voorbeeld. Heb van de <p> een <code> gemaakt, maar verder is ie hetzelfde

Regeren is vooruitschuiven

donderdag 20 oktober 2005 14:33

Acties:

Verwijderd

wat is er mis met het <pre> element? dit is een typisch geval van een block code, dus geen <p> en ook geen <code>

Pagina: 1

Reageer