erlaubt CSS das Kreiren neuer Tags?

[Gast]

Hallo,

in einem Handbuch muss ich Beispiele für Daten im Text besonders kenntlich machen. Die Markierung mit <span> empfinde ich als äußerst umständlich und ressoucenverschwendend bei der Übertragung. Ausserdem ist der Quelltext unübersichtlich.

.eingabe {font-family:courier,monotype; padding:0 5pt 0 5pt; background-color:#ffa}

Gib hier bitte <span class=eingabe>[table]</span> ein und dort <span class=eingabe>[/table]</span>.

Viel besser wäre

x {font-family:courier,monotype; padding:0 5pt 0 5pt; background-color:#ffa}

Gib hier bitte <x>[table]</x> ein und dort <x>[/table]</x>.

Ist das standardkonform?

Fragt Gast

ständig Eingabetexte besonders hervo

[Gunnar Bittersmann]

@@Gast:

nuqneH

Gib hier bitte <x>[table]</x> ein und dort <x>[/table]</x>.

Ist das standardkonform?

Nein. Du kannst in HTML keine eigenen Elemente kreieren.

Jawohl, in *HTML*. Die Markup-Sprache legt fest, welche Elemente zur Verfügung stehen.

In CSS kann man als Typselektoren alles verwenden, was die Markup-Sprache so hergibt (was nicht auf HTML beschränkt ist). Browser interpretieren auch Styles für ihnen unbekannte Elementtypen; weshalb man ja auch neue HTML5-Elemnttypen einsetzen kann, auch wenn der Browser keinen HTML5-Parser hat. Lediglich alten IEs muss man dabei mit einem JavaScript-HTML5-Shim auf die Sprünge helfen (createElement).

Jawohl, *Elemente*, nicht Tags.

Deine Frage hätte lauten müssen: Erlaubt HTML das Kreiren neuer Elemente?

Die Antwort, wie gesagt: Nein.

Ist in dem Fall auch gar nicht nötig. Es gibt ein Element, um Nutzereingaben auszuzeichnen: kbd.

Qapla'

[Der Martin]

Hi,

in einem Handbuch muss ich Beispiele für Daten im Text besonders kenntlich machen. Die Markierung mit <span> empfinde ich als äußerst umständlich und ressoucenverschwendend bei der Übertragung. Ausserdem ist der Quelltext unübersichtlich.

.eingabe {font-family:courier,monotype; padding:0 5pt 0 5pt; background-color:#ffa}

Gib hier bitte <span class=eingabe>[table]</span> ein und dort <span class=eingabe>[/table]</span>.

das ist nicht nur unschön, sondern sogar ungültiges HTML: Ein inline-Element wie span darf keine Tabelle und kein Blockelement enthalten - ich nehme an, du willst mit dem Pseudocode andeuten, dass es auch eine Tabelle sein könnte, obwohl ich aus der gezeigten Verschachtelung nicht schlau werde. Wenn schon, dann nimm ein Blockelement wie div, das seinerseits auch weitere blocklevel-Elemente enthalten darf.

Viel besser wäre

x {font-family:courier,monotype; padding:0 5pt 0 5pt; background-color:#ffa}

Gib hier bitte <x>[table]</x> ein und dort <x>[/table]</x>.

Ist das standardkonform?

Das wäre aus der Sicht von CSS völlig okay, aber ebenfalls ungültiges HTML. Du kannst nicht einfach nach belieben neue Tags/Elemente erfinden und dann noch behaupten, das sei HTML.

Aber wenn du sagst, es handelt sich um Beispiel-Abschnitte - warum verwendest du dann nicht ein Element, das genau dafür gedacht ist, nämlich samp? Allerdings darf auch samp nur inline-Inhalt haben; wenn es unbedingt blocklevel-Elemente sein müssen, könnte man -bei großzügiger Auslegung der Semantik- vielleicht auch noch blockquote verwenden.

So long,
 Martin

[Steel]

Moin,

Gib hier bitte <span class=eingabe>[table]</span> ein und dort <span class=eingabe>[/table]</span>.

das ist nicht nur unschön, sondern sogar ungültiges HTML: Ein inline-Element wie span darf keine Tabelle und kein Blockelement enthalten - ich nehme an, du willst mit dem Pseudocode andeuten, dass es auch eine Tabelle sein könnte, obwohl ich aus der gezeigten Verschachtelung nicht schlau werde. Wenn schon, dann nimm ein Blockelement wie div, das seinerseits auch weitere blocklevel-Elemente enthalten darf.

Ich denke doch, er moechte lediglich text ausgeben in dem die strings [table] und [/table] auf bestimmte Art hervorgehoben sind. Vielleicht eine kleine Anleitung zu BBCode.

[Cheatah]

Hi,

Gib hier bitte <span class=eingabe>[table]</span> ein und dort <span class=eingabe>[/table]</span>.
das ist nicht nur unschön, sondern sogar ungültiges HTML: Ein inline-Element wie span darf keine Tabelle und kein Blockelement enthalten

es darf aber Text enthalten, auch wenn dieser für das menschliche Auge einem HTML-Tag ein bisschen ähnlich sieht ;-)

ich nehme an, du willst mit dem Pseudocode andeuten, dass es auch eine Tabelle sein könnte, obwohl ich aus der gezeigten Verschachtelung nicht schlau werde.

Ich nehme an, er möchte ein konkretes Textbeispiel einschließlich des von ihm angedachten HTML-Codes aufzeigen. Dieses Textbeispiel fordert den Nutzer auf, "[table]" und "[/table]" an einer in dem Beispiel nicht erkennbaren Stelle einzugeben.

Das wäre aus der Sicht von CSS völlig okay, aber ebenfalls ungültiges HTML. Du kannst nicht einfach nach belieben neue Tags/Elemente erfinden und dann noch behaupten, das sei HTML.

Siehe auch Gunnars Antwort. Ich tendiere ebenfalls zum <kbd>-Element. Sehr weit interpretiert wäre in HTML5 noch das <mark>-Element möglich, wobei der "reference purpose" wohl noch zu suchen wäre.

Aber wenn du sagst, es handelt sich um Beispiel-Abschnitte - warum verwendest du dann nicht ein Element, das genau dafür gedacht ist, nämlich samp?

"The samp element represents (sample) output from a program or computing system." -- http://dev.w3.org/html5/spec/single-page.html#the-samp-element

"Designates sample output from programs, scripts, etc." -- http://www.w3.org/TR/html401/struct/text.html#edef-SAMP

Cheatah

[Gast]

Hi,

Gib hier bitte <span class=eingabe>[table]</span> ein und dort <span class=eingabe>[/table]</span>.

das ist nicht nur unschön, sondern sogar ungültiges HTML: Ein inline-Element wie span darf keine Tabelle und kein Blockelement enthalten

Missverständliches Beispiel. Im Handbuch beschreibe ich die Eingabemöglichkeit in ein Textfeld <textarea>. Dort kann man genau die Zeichen [table] angeben, die später vom PHP- Programm zu einer gültigen Tabelle gemacht werden.

Und weil es eben so missverständlich ist, will ich dieses Wort mit sieben Zeichen ordentlich hervorheben mit Hintergrundfarbe und kleinem Abstand links und rechts. Es gibt auch Eingaben mit Zeichen, gefolgt von einem Leerzeichen. Hier in SELFHTML kann man ABC   nicht ansehen, wieviele Leerzeichen gemeint sind.

<kbd> kannte ich nicht, danke für den Tipp.

Gast

[Gast]

Hi,

das Handbuch ist für unbekannte Leser im Internet.

Da kommt dann sowas vor:

Die Überschriftszeile beginnt mit den drei Zeichen ||  Strich Strich leer. Die Spalten werden getrennt mit  |  leer Strich leer und das Ende der Zeile ist  | leer Strich.

Jede Textzeile beginnt mit den zwei Zeichen |  Strich leer.

Das _kann_ man doch nur mit grafischer Hilfe verständlich darstellen. Oder wie macht ihr das?

Gast

[Matthias Apsel]

Om nah hoo pez nyeetz,

Jede Textzeile beginnt mit den zwei Zeichen |  Strich leer.

Das _kann_ man doch nur mit grafischer Hilfe verständlich darstellen. Oder wie macht ihr das?

code-Element?

Matthias

[Gast]

Hallo,

code-Element?

Welches macht Leerzeichen sichtbar, die aber beim Kopieren (copy / paste) Leerzeichen sein müssen. An &middot; hatte ich auch schon gedacht ...

Gast

[Gunnar Bittersmann]

@@Gast:

nuqneH

Welches macht Leerzeichen sichtbar, die aber beim Kopieren (copy / paste) Leerzeichen sein müssen.

Keines.

An &middot; hatte ich auch schon gedacht ...

Vergiss es wieder. Du könntest natürlich (serverseitig oder clientseitig) Leerzeichen gegen · austauschen. Beim Kopieren hast du dann aber eben ·, keine Leerzeichen.

An was du denken kannst ist, eine eigene Schriftart zu verwenden, deren Glyphe fürs Leerzeichen wie · aussieht. unicode-range könnte dabei hilfreich sein.

Qapla'

[Gunnar Bittersmann]

@@Gast:

nuqneH

Welches macht Leerzeichen sichtbar, die aber beim Kopieren (copy / paste) Leerzeichen sein müssen. An &middot; hatte ich auch schon gedacht ...

Vielleicht ist der Syntax-Highlighter Prism für dich interessant. Möglicherweise kriegt man das Plugin Show Invisibles dazu, auch Leerzeichen sichtbar zu machen.

Qapla'

[Gunnar Bittersmann]

@@Gast:

nuqneH

Oder wie macht ihr das?

Wikipedia macht’s so.

Qapla'

[Gast]

Wikipedia macht’s so.

Uups - da habe ich das Rad nochmal neu erfunden. Muss mal sehen, ob ich den Wikipedia-Standard noch (zusätzlich) übernehmen kann.

Gast

[Gast]

Wikipedia macht’s so.

Beim genauen Hinsehen: Wikipedia ist doch nicht so toll, für das Zeilenende wird eine extra Zeile gebraucht, bläht die Eingabe der Tabellen auf die doppelte Zeilenzahl und erschwert die Übersicht im Eingabefeld.

Mein Rad ist runder.

Gast

[Gunnar Bittersmann]

@@Gast:

nuqneH

Uups - da habe ich das Rad nochmal neu erfunden.

Was auch für Nutzer nicht so gut ist, noch eine weitere Syntax lernen zu müssen. Besser ist es, eine schon bekannte zu verwenden …

Beim genauen Hinsehen: Wikipedia ist doch nicht so toll

… vielleicht dann die von Blogtext (Wordpress).

Qapla'

[Gast]

Hallo, Gunnar

… vielleicht dann die von Blogtext (Wordpress).

Ja, so ist meine auch:
[table]
|| Tag | Zeit | Bühne | Gruppe |
| 15. | 17:00 | Marktplatz | Flotte Bläser |
| 16. | 18:30 | Park | Jodlertrio |
[/table]

Mit nützlichen Zusätzen:
|>  wird zu <td align=right> für Zahlen
|.  wird zu <td align=center>

Wobei
|| Tag | Zeit | Bühne | Gruppe |

deutlich kürzer als
|=Heading Col 1 |=Heading Col 2 |

Heading gehört doch in the row, nicht in the cell.

Gast

[Themm]

Hi,
ich denke er/sie meint, ob es generell möglich ist mit CSS neue "HTML"-Tags zu kreieren. Dies geht :D :

Beispiel:

style.css:

  
test{  
color:red;  
align:right;  

Irgendeine .htm/.html-Datei:

  
<test>fdhjkgsdhlsfdjkagh</test>  

Aber: Es ist unschön, eig. nicht gültig und höchstens eine Notlösung. Aber dass man auch "inkorrektes" HTML verwenden kann, beweist Google aber auch mit dem "Google+"-Button, oder ist das: <g:plusone> korrektes HTML? ;)

[Gunnar Bittersmann]

@@Themm:

nuqneH

ich denke er/sie meint, ob es generell möglich ist mit CSS neue "HTML"-Tags zu kreieren. Dies geht :D :

Nein, tut es nicht. Mit CSS kann man nichts in HTML kreieren. Man kann auf bestehendes Markup (egal ob valides HTML oder was anderes) aufsetzen.

Qapla'

[Cheatah]

Hi,

ich denke er/sie meint, ob es generell möglich ist mit CSS neue "HTML"-Tags zu kreieren. Dies geht :D :

nein. Durch das Angeben eines Typselektors wird weder der HTML-Standard erweitert, noch entstehen magisch irgendwelche Elemente oder deren Definitionen. CSS ist lediglich ohne weiteres in der Lage, Elemente zu selektieren, von deren Existenz die Erfinder von CSS nichts wissen.

Das ändert nichts an der Frage, ob die Elemente verwendet werden können. Kurz gesagt ist der Themenbereich "CSS" hier ungünstig gewählt, weil CSS nicht das Problem ist.

Aber: Es ist unschön, eig. nicht gültig und höchstens eine Notlösung. Aber dass man auch "inkorrektes" HTML verwenden kann, beweist Google aber auch mit dem "Google+"-Button, oder ist das: <g:plusone> korrektes HTML? ;)

Nein, denn es ist kein HTML. Korrekt ist es dennoch, weil es absolut korrektes XML ist, welches (soweit ich es von Google+ weiß) korrekt in das HTML eingebunden wird.

Cheatah

[Gast]

Hallo,

bisher war es so: Für ein Formular habe ich ein HTML- Dokument erstellt, dass dieses Formular erklärt, auch die einzelnen Felder.

Gaaanz früher gab es die [F1] Taste, die kontextsensitiv Hilfe geholt hat.

Keine Ahnung, ob ich noch darauf vetrauen darf, dass ein Gerät noch alle Tassen im Schrank - sorry, alle Schlüssel auf dem Brett hat (keyboard). Und wenn ja, ob jeder Browser die zuordnen kann.

Im Moment mache ich weiterhin das HTML- Formular, für die Felder setze ich Sprungmarken ein. Neben dem Eingabefeld ist eine Hilfeschaltfläche, die zum Hilfedokument und dort zur Sprungmarke hüpft.

Sehr unangenehmer Nebeneffekt: Nun kann man nicht mehr mit der [TAB] Taste von Feld zu Feld hüpfen, weil die Hilfeschaltflächen dazwischen sind. Also muss ich die Eingabefelder mit tabindex logisch hintereinander stellen. Und wehe, ich füge mal eins dazu oder nehme eins weg, dann geht der Zirkus von vorne los.

Nun denke ich darüber nach, ob man die feldbezogenen Hilfstexte in die Datenbank stellen und mit AJAX holen soll. Aber AJAX muss ja auch wieder mit einer - im Tabweg stehenden - Schaltfläche ausgelöst werden. Und ich habe kein Dokument, dass Zusammenhänge beschreibt.

Oh - heute ist nicht mein Tag, bitte richtet mich mit guten Vorschlägen wieder auf.

Danke, GAst

[Gast]

Hallo,

Gaaanz früher gab es die [F1] Taste, die kontextsensitiv Hilfe geholt hat.

Hat sich erledigt, http://de.selfhtml.org/html/verweise/tastatur.htm#kuerzel@title=hier wird schon gewarnt:

"Beachten Sie:
Benutzen Sie Tasten, die auf jeder Tastatur zu finden sind. Funktionstasten etwa, wie es sie auf MF-II-Tastaturen für MS Windows gibt, können Sie mit dieser Angabe auch gar nicht ansprechen."

Frage mich, woher ich "jeder Tastatur" kennen soll. Bei meinem Laptop kann ich keine Akzente auf Buchstaben setzen. Taste wäre da, aber der Treiber wartet nicht auf den nächsten Buchstaben.

Auf was kann man sich überhaupt noch verlassen? Muss jeder die lateinischen Zeichen a .. z auf der Tastatur haben, um sich im Web zu bewegen? Was ist mit den Griechen und Russen?

Mir kommt da eine Idee, die aber richtig mit Arbeit verbunden ist.

HTML Dokument machen wie bisher, zusätzlich Marker. Dann beim übermausen (mouseover - nicht click) mit AJAX daraus den Hilfetext fürs Feld holen.

Gast

[CPAN]

Muss jeder die lateinischen Zeichen a .. z auf der Tastatur haben, um sich im Web zu bewegen?

Ja.

Was ist mit den Griechen und Russen?

Die schalten logische Layouts um. Das ist übrigens auch eine (weniger gute) Lösung für dein Akzenteproblem.