Zur digitalen Version
Infos zur Seite
Details wie Autor
Details wie Veröffentlichungsort und -jahr
Infos zur Seite
7⃣znrcrfch⃣fdsdfsfdsf
Wilhelm Mundt
Informationen über die Stadt und ihre Umgebung
Herausgegeben von der Stadt Eschershausen
Druck: Druck- und Verlagshaus Hüpke & Sohn, Weserlandverlag GmbH & Co. KG, Holzminden
Favicon-Test
Float
SASSINLENKE
BürgermeisterStadtdirektor
Flexbox mit p
SASSIN
Bürgermeister
LENKE
Stadtdirektor
Flexbox mit p
SASSIN
Bürgermeister
LENKE
Stadtdirektor
Flexbox mit div
Back
Top of page | Contents
Zurück
Seitenanfang | Inhalt
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
(<html>
)
<h1>
<h2>
<h3>
<h4>
<h5>
<h6>
Überschrift in der normalen Absatzformatierung <p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
In in rutrum odio, quis condimentum mauris. Ut nibh ante, imperdiet non fringilla vel, dictum sit amet diam. Nullam non volutpat mi, id consequat massa. Phasellus in purus ante. Sed blandit tortor eu pharetra volutpat. Fusce cursus, velit ut tristique imperdiet, ex libero egestas eros, sit amet euismod ligula elit vel dolor. Nam aliquet orci sit amet urna ultricies, a commodo velit bibendum. In justo ex, euismod non urna sit amet, suscipit feugiat nulla. Quisque ac nunc mauris. Vivamus sit amet hendrerit leo. Sed lobortis quam nec nulla porta, ac elementum arcu luctus. Donec tristique sem mi, auctor lobortis justo interdum in. Nullam metus nisl, tempus hendrerit imperdiet sed, maximus et risus. Mauris mattis rutrum turpis ac venenatis. Phasellus tortor arcu, tincidunt sit amet laoreet a, bibendum vitae neque. Praesent vitae massa non justo accumsan efficitur a sit amet mi.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
In in rutrum odio, quis condimentum mauris. Ut nibh ante, imperdiet non fringilla vel, dictum sit amet diam. Nullam non volutpat mi, id consequat massa. Phasellus in purus ante. Sed blandit tortor eu pharetra volutpat. Fusce cursus, velit ut tristique imperdiet, ex libero egestas eros, sit amet euismod ligula elit vel dolor. Nam aliquet orci sit amet urna ultricies, a commodo velit bibendum. In justo ex, euismod non urna sit amet, suscipit feugiat nulla. Quisque ac nunc mauris. Vivamus sit amet hendrerit leo. Sed lobortis quam nec nulla porta, ac elementum arcu luctus. Donec tristique sem mi, auctor lobortis justo interdum in. Nullam metus nisl, tempus hendrerit imperdiet sed, maximus et risus. Mauris mattis rutrum turpis ac venenatis. Phasellus tortor arcu, tincidunt sit amet laoreet a, bibendum vitae neque. Praesent vitae massa non justo accumsan efficitur a sit amet mi.
Etiam pellentesque interdum lacinia. Phasellus at justo id libero eleifend congue et vel sapien. In diam metus, congue eu ex ut, vulputate eleifend enim. Sed nec orci auctor nisl gravida scelerisque. Pellentesque ipsum risus, porta vitae venenatis a, sodales id dui. Integer ac dignissim dolor. Fusce molestie feugiat enim a aliquam. Donec sollicitudin nulla vel urna posuere, et faucibus ipsum semper. Sed ultrices, ante nec finibus varius, mi dui rhoncus libero, sed malesuada justo felis a elit. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam in pellentesque arcu, tempus placerat odio. Duis id pharetra tortor. Phasellus pharetra justo justo, vitae volutpat est sagittis ut.
Aenean tincidunt lacus quis porttitor auctor. Nunc sapien sapien, laoreet sit amet magna sit amet, accumsan tincidunt odio. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent vitae semper velit. Nam condimentum volutpat mattis. Interdum et malesuada fames ac ante ipsum primis in faucibus. Vestibulum et felis eget leo lacinia cursus. Donec vitae sem lacus.
Donec et egestas ipsum. Fusce nec nisi non velit lacinia bibendum interdum sit amet est. Curabitur enim mi, aliquet vel nulla eu, condimentum semper nisl. In id nunc et ante pharetra laoreet. Phasellus et nibh id enim tempor consequat id et libero. Ut eros tellus, dignissim et enim at, imperdiet porta eros. Integer a luctus nibh, non porttitor eros. Pellentesque at congue est, eu ornare orci. Suspendisse nec sapien vel dui venenatis feugiat sit amet non sem. Maecenas auctor augue ac dui tincidunt, vel accumsan libero ultrices. Nulla id aliquet ligula. Aliquam sodales, velit id commodo convallis, risus erat luctus ligula, id dignissim libero libero vitae arcu. Nullam sed nisl nec ipsum fermentum dictum sed id enim.
Aliquam nibh est, consequat quis ipsum a, efficitur tempor mauris. Maecenas pulvinar consequat sem ac porta. Fusce suscipit libero eget mi tincidunt mollis. Fusce scelerisque maximus nulla, vitae tincidunt lorem iaculis et. Fusce non gravida elit, eu vehicula nibh. Cras cursus sapien quis laoreet euismod. Phasellus eget varius quam. Vivamus ac metus tortor. Etiam mollis tortor quis dolor semper, vitae viverra metus viverra. Nam sodales, urna nec egestas tincidunt, diam justo consequat arcu, sed posuere libero neque eget lorem. Suspendisse scelerisque ultrices sem non tempor.
Nam posuere arcu est, ac ullamcorper turpis dictum id. Proin ligula nisl, hendrerit eleifend lectus sit amet, ultrices fringilla felis. Fusce ac aliquam risus. Fusce id semper sem. Pellentesque semper interdum feugiat. Duis rhoncus molestie dui, eget sagittis justo lacinia laoreet. Donec quis aliquet neque, ac efficitur velit. Integer semper sapien in velit tempus venenatis.
Morbi convallis elit vel posuere aliquet. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nullam lacinia cursus sodales. Curabitur pellentesque efficitur nibh id aliquam. Morbi faucibus sagittis cursus. Maecenas ac dolor non nunc commodo bibendum. Pellentesque porttitor elit id leo pharetra, sit amet pharetra turpis venenatis. Morbi ut fermentum elit, sit amet faucibus ipsum. Nulla dui dui, suscipit nec odio et, varius egestas metus. Nullam convallis porttitor enim vitae finibus. Cras mattis efficitur elit, nec maximus turpis tincidunt vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elementum leo vel augue mattis vehicula.
Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam mattis felis leo, vitae aliquet tortor tempus eu. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer placerat cursus ipsum in commodo. Sed gravida consequat nulla, et mollis urna eleifend feugiat. Suspendisse laoreet aliquet nulla et vulputate. Aenean egestas at justo et volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam pharetra, enim quis vulputate ultrices, ipsum ipsum iaculis urna, nec porta dui felis eu nibh. Duis iaculis risus nec urna iaculis, suscipit cursus dolor aliquam.
Morbi in fermentum lacus. Nullam bibendum ex vitae ullamcorper egestas. In sit amet arcu in magna aliquet malesuada vel a libero. Cras vitae elementum ligula, quis cursus est. Pellentesque vel dui tristique, pellentesque libero sed, tristique elit. Vivamus congue, mi sit amet malesuada facilisis, urna augue ultrices urna, vitae varius ligula augue non nulla. Suspendisse rhoncus purus nunc, a tincidunt nisi mattis eget. Aenean sit amet diam odio. Morbi eu lectus tortor.
Quisque vel augue vel turpis egestas venenatis. In et maximus erat, eu euismod sapien. Suspendisse eu aliquet massa. Cras placerat commodo lorem, vitae dictum velit condimentum nec. Nullam viverra magna nisl, nec vehicula dui euismod efficitur. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut ac mi eu turpis scelerisque interdum. Phasellus eget enim dignissim felis vestibulum tempor. Morbi sit amet nulla sed ex dictum auctor. Vestibulum nec dapibus lectus, sed congue dui. Duis eget ipsum ac mi ultrices laoreet sit amet id tortor. Vivamus posuere sapien eget augue suscipit, id laoreet quam lobortis. Etiam scelerisque tincidunt leo vel condimentum. Nulla varius magna maximus libero congue tempus.
Sed ut sagittis dui, eget pretium orci. Praesent porttitor ullamcorper sem vel commodo. Nam congue, sem at lobortis laoreet, mi libero mollis nisl, eu congue neque mauris ac ante. Aenean volutpat viverra justo, a sodales massa. Curabitur maximus, ipsum sed suscipit auctor, sem lectus ullamcorper nulla, non imperdiet nibh lectus ultricies ante. Sed pharetra laoreet mauris, et hendrerit tellus ullamcorper quis. Fusce luctus lobortis nulla, non condimentum nibh. Nam iaculis pretium nisi, quis accumsan quam. Suspendisse fermentum semper ex, in tristique elit luctus nec. Mauris consequat erat in risus luctus porttitor. Nunc leo lacus, commodo ut efficitur sed, tempus in nisi. Maecenas dignissim fermentum mi, id euismod ipsum bibendum et.
Duis dolor tortor, bibendum convallis magna vitae, ornare luctus urna. Suspendisse id suscipit libero, vitae fringilla dui. In hac habitasse platea dictumst. Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque at augue congue, vulputate mauris quis, vestibulum felis. Phasellus convallis blandit velit a condimentum. Morbi a metus nisl. Proin a consectetur diam. Nulla scelerisque ligula non aliquet iaculis. Aenean non gravida neque, vitae faucibus diam. Interdum et malesuada fames ac ante ipsum primis in faucibus. Integer at ullamcorper quam. Nulla lacinia volutpat libero, ut placerat magna viverra sed.
Quisque facilisis tincidunt felis ac dignissim. Integer quis quam risus. Nam consequat mattis lectus, ac suscipit elit sagittis et. Proin consectetur erat nec efficitur euismod. Nunc metus ex, lacinia nec velit eget, suscipit porttitor massa. Curabitur posuere augue metus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse urna mi, maximus a ipsum sit amet, finibus dapibus orci. Mauris at ultricies orci, sed ultricies augue. Morbi vitae turpis vel quam sagittis porta. Maecenas sed arcu pulvinar, vehicula massa pretium, vehicula felis. Pellentesque et dui lacus. Nulla pulvinar sollicitudin quam sed maximus. Suspendisse potenti. Nullam eleifend commodo arcu, ut dapibus ipsum sodales at. Nulla nec efficitur nulla, quis aliquet urna.
Quisque vel augue vel turpis egestas venenatis. In et maximus erat, eu euismod sapien. Suspendisse eu aliquet massa. Cras placerat commodo lorem, vitae dictum velit condimentum nec. Nullam viverra magna nisl, nec vehicula dui euismod efficitur. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut ac mi eu turpis scelerisque interdum. Phasellus eget enim dignissim felis vestibulum tempor. Morbi sit amet nulla sed ex dictum auctor. Vestibulum nec dapibus lectus, sed congue dui. Duis eget ipsum ac mi ultrices laoreet sit amet id tortor. Vivamus posuere sapien eget augue suscipit, id laoreet quam lobortis. Etiam scelerisque tincidunt leo vel condimentum. Nulla varius magna maximus libero congue tempus.
Sed ut sagittis dui, eget pretium orci. Praesent porttitor ullamcorper sem vel commodo. Nam congue, sem at lobortis laoreet, mi libero mollis nisl, eu congue neque mauris ac ante. Aenean volutpat viverra justo, a sodales massa. Curabitur maximus, ipsum sed suscipit auctor, sem lectus ullamcorper nulla, non imperdiet nibh lectus ultricies ante. Sed pharetra laoreet mauris, et hendrerit tellus ullamcorper quis. Fusce luctus lobortis nulla, non condimentum nibh. Nam iaculis pretium nisi, quis accumsan quam. Suspendisse fermentum semper ex, in tristique elit luctus nec. Mauris consequat erat in risus luctus porttitor. Nunc leo lacus, commodo ut efficitur sed, tempus in nisi. Maecenas dignissim fermentum mi, id euismod ipsum bibendum et.
Quisque vel augue vel turpis egestas venenatis. In et maximus erat, eu euismod sapien. Suspendisse eu aliquet massa. Cras placerat commodo lorem, vitae dictum velit condimentum nec. Nullam viverra magna nisl, nec vehicula dui euismod efficitur. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut ac mi eu turpis scelerisque interdum. Phasellus eget enim dignissim felis vestibulum tempor. Morbi sit amet nulla sed ex dictum auctor. Vestibulum nec dapibus lectus, sed congue dui. Duis eget ipsum ac mi ultrices laoreet sit amet id tortor. Vivamus posuere sapien eget augue suscipit, id laoreet quam lobortis. Etiam scelerisque tincidunt leo vel condimentum. Nulla varius magna maximus libero congue tempus.
Sed ut sagittis dui, eget pretium orci. Praesent porttitor ullamcorper sem vel commodo. Nam congue, sem at lobortis laoreet, mi libero mollis nisl, eu congue neque mauris ac ante. Aenean volutpat viverra justo, a sodales massa. Curabitur maximus, ipsum sed suscipit auctor, sem lectus ullamcorper nulla, non imperdiet nibh lectus ultricies ante. Sed pharetra laoreet mauris, et hendrerit tellus ullamcorper quis. Fusce luctus lobortis nulla, non condimentum nibh. Nam iaculis pretium nisi, quis accumsan quam. Suspendisse fermentum semper ex, in tristique elit luctus nec. Mauris consequat erat in risus luctus porttitor. Nunc leo lacus, commodo ut efficitur sed, tempus in nisi. Maecenas dignissim fermentum mi, id euismod ipsum bibendum et.
Unsortierte Liste | <ul> | </ul> |
---|---|---|
Aufzählungspunkt (CSS-Standardwert) | <ul style="list-style-type: disc"> | </ul> |
Aufzählungsquadrat | <ul style="list-style-type: square"> | </ul> |
Ohne Aufzählungszeichen | <ul style="list-style-type: none"> | </ul> |
Listeneintrag | <li> | </li> |
Sortierte Liste | <ol> | </ol> |
---|---|---|
Nummerierung (CSS-Standardwert) | <ol style="list-style-type: decimal"> | </ol> |
Nummerierung mit führender Null | <ol style="list-style-type: decimal-leading-zero"> | </ol> |
Großbuchstaben-Aufzählung | <ol style="list-style-type: upper-alpha"> | </ol> |
Kleinbuchstaben-Aufzählung | <ol style="list-style-type: lower-alpha"> | </ol> |
Aufzählung mit römischen Zahlen in Großbuchstaben | <ol style="list-style-type: upper-roman"> | </ol> |
Aufzählung mit römischen Zahlen in Kleinbuchstaben | <ol style="list-style-type: lower-roman"> | </ol> |
Ohne Aufzählung | <ol style="list-style-type: none"> | </ol> |
Anfangszähler für sortierte Liste setzen (immer numerisch) | <ol start="17"> | </ol> |
Listeneintrag | <li> | </li> |
Zähler für Eintrag in sortierten Listen setzen (immer numerisch) | <li value="17"> | </li> |
Definitionsliste | <dl> | </dl> |
---|---|---|
Listeneintrag (Begriff) | <dt> | </dt> |
Listeneintrag (Beschreibung des Begriffs) | <dd> | </dd> |
CSS-Standardwerte
ul: display: block; margin: 1em 0 1em 0; border: 0 0 0 0; padding: 0 0 0 40px; list-style-type: disc
ol: display: block; margin: 1em 0 1em 0; border: 0 0 0 0; padding: 0 0 0 40px; list-style-type: decimal
li: display: list-item; margin: 0 0 0 0; border: 0 0 0 0; padding: 0 0 0 0
p: display: block; margin: 1em 0 1em 0; border: 0 0 0 0; padding: 0 0 0 0
Eigene Formatvorlagen-Standardwerte
ul: margin: 1em 0 0 0; border: 0 0 0 0; padding: 0 0 0 1.5em; text-indent: 0; list-style-type: square
ol: margin: 1em 0 0 0; border: 0 0 0 0; padding: 0 0 0 1.5em; text-indent: 0
ul ul, ul ol, ol ul, ol ol: margin: 0 0 0 0
li: margin: 0 0 0.25em 0; border: 0 0 0 0; padding: 0 0 0 0; text-indent: 0
ul p, ol p: margin: 0.25em 0 0.25em 0
dl: margin: 1em 0 0.75em 0; border: 0 0 0 0; padding: 0 0 0 0; text-indent: 0
dl p: margin: 0.25em 0 0.25em 0
dt: margin: 0.5em 0 0.25em 0; border: 0 0 0 0; padding: 0 0 0 1.25em; text-indent: 0; font-weight: bold
dd:
p: margin: 1em 0 1em 0; border: 0 0 0 0; padding: 0 0 0 0
Unsortierte Listen:
<ul style="padding-left: 1.5em">
<ul style="padding-left: 1.5em">
<ul style="padding-left: 0em">
Sortierte Listen mit Ziffern-Nummerierung (Ziffernbreite 0,5 Geviert):
<ol style="padding-left: 1.5em">
<ol style="padding-left: 2em">
<ol style="padding-left: 2.5em">
<ol style="padding-left: 3em">
Sortierte Listen mit alphabetischer Aufzählung (Breite Buchstabe „M“ 1 Geviert):
<ol style="padding-left: 1.75em">
<ol style="padding-left: 2.75em">
<ol style="padding-left: 3.75em">
Hier ist ein normaler Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Dies ist ein Beispiel einer langen sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Dieser Listeneintrag besteht aus zwei normalen Textabsätzen (<li><p>Text</p><p>Text</p><li>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Und nun der zweite normaler Textabsatz (<p>) in einem Listeneintrag. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Hier sind die Listeneinträge durch zwei normale Textabsätze (<li>Listeneintrag</li><p>Text</p><p>Text</p><li>Listeneintrag</li>) unterbrochen. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Und nun der zweite normaler Textabsatz (<p>) in einem Listeneintrag. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Dieser Listeneintrag besteht aus zwei normalen Textabsätzen (<li><p>Text</p><p>Text</p><li>) in einer Liste. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Und nun der zweite normaler Textabsatz (<p>) in einem Listeneintrag. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Hier ist ein normaler Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ol style="list-style-type: decimal">
, sonst Formatvorlage)Dies ist ein Beispiel einer sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Num zum Vergleich eine unsortierte Liste nach Formatvorlage.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ol style="margin-left: 0; border-left: 0; padding-Left: 1.5em; list-style-type: decimal">
, sonst Formatvorlage)Dies ist ein Beispiel einer sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ol style="list-style-type: decimal">
, sonst Formatvorlage)Dies ist ein Beispiel einer sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ol style="margin-left: 0; border-left: 0; padding-Left: 2em; list-style-type: decimal">
, sonst Formatvorlage)Dies ist ein Beispiel einer sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ol style="list-style-type: decimal">
, sonst Formatvorlage)Dies ist ein Beispiel einer sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ol style="margin-left: 0; border-left: 0; padding-Left: 2.5em; list-style-type: decimal">
, sonst Formatvorlage)Dies ist ein Beispiel einer sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ol style="list-style-type: decimal">
, sonst Formatvorlage)Dies ist ein Beispiel einer sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ol style="margin-left: 0; border-left: 0; padding-Left: 3em; list-style-type: decimal">
, sonst Formatvorlage)Dies ist ein Beispiel einer sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ul style="list-style-type: upper-alpha">
, sonst Formatvorlage)Dies ist ein Beispiel einer sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ul style="margin-left: 0; border-left: 0; padding-Left: 1.75em; list-style-type: upper-alpha">
, sonst Formatvorlage)Dies ist ein Beispiel einer sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ul style="list-style-type: upper-alpha">
, sonst Formatvorlage)Hier ist ein normaler Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Dies ist ein Beispiel einer langen sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ul style="margin-left: 0; border-left: 0; padding-Left: 2.75em; list-style-type: upper-alpha">
, sonst Formatvorlage)Dies ist ein Beispiel einer sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ul style="list-style-type: upper-alpha">
, sonst Formatvorlage)Dies ist ein Beispiel einer langen sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ul style="margin-left: 0; border-left: 0; padding-Left: 3.75em; list-style-type: upper-alpha">
, sonst Formatvorlage)Dies ist ein Beispiel einer sortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Hier ist ein normaler Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Dies ist ein Beispiel einer langen unsortierten Liste (<ul>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Dieser Listeneintrag besteht aus zwei normalen Textabsätzen (<li><p>Text</p><p>Text</p><li>) in einer Liste. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Und nun der zweite normaler Textabsatz (<p>) in einem Listeneintrag. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Hier sind die Listeneinträge durch zwei normale Textabsätze (<li>Listeneintrag</li><p>Text</p><p>Text</p><li>Listeneintrag</li>) unterbrochen. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Und nun der zweite normaler Textabsatz (<p>) in einem Listeneintrag. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Dieser Listeneintrag besteht aus zwei normalen Textabsätzen (<li><p>Text</p><p>Text</p><li>) in einer Liste. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Und nun der zweite normaler Textabsatz (<p>) in einem Listeneintrag. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Hier ist ein normaler Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ul style="list-style-type: square">
, sonst Formatvorlage)Dies ist ein Beispiel unsortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ul style="margin-left: 0; border-left: 0; padding-Left: 1.5em; list-style-type: square">
, sonst Formatvorlage)Dies ist ein Beispiel einer unsortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ul style="list-style-type: none">
, sonst Formatvorlage)Dies ist ein Beispiel einer unsortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ul style="margin-left: 0; border-left: 0; padding-Left: 1.5em; list-style-type: none">
, sonst Formatvorlage)Dies ist ein Beispiel einer unsortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<ul style="margin-left: 0; border-left: 0; padding-Left: 0; list-style-type: none">
, sonst Formatvorlage)Dies ist ein Beispiel einer unsortierten Liste (<ol>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Hier ist ein normaler Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Dies ist ein Beispiel einer Definitionsliste (<dl>) nach einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Diese Begriffsbeschreibung besteht aus zwei normalen Textabsätzen in einer Definitionsliste (<dd><p>Text</p><p>Text</p><dd>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Und nun der zweite normaler Textabsatz in einem Listeneintrag. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
So geht es dann weiter mit einem normalen Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Hier ist ein normaler Textabsatz (<p>). Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Einfache Tabelle
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Tabelle mit Überschriftszellen
Hof 1 | Hof 3 | Hof 4 |
---|---|---|
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Tabelle mit Tabellenüberschrift
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Tabelle mit Tabellenüberschrift und Überschriftszellen
Hof 1 | Hof 3 | Hof 4 |
---|---|---|
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Nochmal mit tbody
Einfache Tabelle
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Tabelle mit Überschriftszellen
Hof 1 | Hof 3 | Hof 4 |
---|---|---|
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Tabelle mit Tabellenüberschrift
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Tabelle mit Tabellenüberschrift und Überschriftszellen
Hof 1 | Hof 3 | Hof 4 |
---|---|---|
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Nochmal mit thead und tbody
Einfache Tabelle
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Tabelle mit Überschriftszellen
Hof 1 | Hof 3 | Hof 4 |
---|---|---|
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Tabelle mit Tabellenüberschrift
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Tabelle mit Tabellenüberschrift und Überschriftszellen
Hof 1 | Hof 3 | Hof 4 |
---|---|---|
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Nochmal mit thead, tbody und tfoot
Einfache Tabelle
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
57 Tiere | 11 Tiere | 37 Tiere |
Tabelle mit Überschriftszellen
Hof 1 | Hof 3 | Hof 4 |
---|---|---|
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
57 Tiere | 11 Tiere | 37 Tiere |
Tabelle mit Tabellenüberschrift
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
57 Tiere | 11 Tiere | 37 Tiere |
Tabelle mit Tabellenüberschrift und Überschriftszellen
Hof 1 | Hof 3 | Hof 4 |
---|---|---|
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
57 Tiere | 11 Tiere | 37 Tiere |
Tabelle mit Tabellenüberschrift und Überschriftszellen
Abschnittsüberschrift | ||
---|---|---|
Hof 1 | Hof 3 | Hof 4 |
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
Abschnittsüberschrift | ||
Hof 1 | Hof 3 | Hof 4 |
Pferd | Esel | Huhn |
Kuh | Schwein | Ochse |
Hund | Reh | Giraffe |
57 Tiere | 11 Tiere | 37 Tiere |
Dies ist ein Beispiel einer Tabelle.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. | Ut varius ipsum ipsum, et accumsan ligula semper vel. | In in rutrum odio, quis condimentum mauris. Ut nibh ante, imperdiet non fringilla vel, dictum sit amet diam. | Nam aliquet orci sit. | Nullam metus nisl, tempus hendrerit imperdiet sed, maximus et risus. |
---|---|---|---|---|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. | Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris. | In in rutrum odio, quis condimentum mauris. Ut nibh ante, imperdiet non fringilla vel, dictum sit amet diam. Nullam non volutpat mi, id consequat massa. Phasellus in purus ante. Sed blandit tortor eu pharetra volutpat. Fusce cursus, velit ut tristique imperdiet, ex libero egestas eros, sit amet euismod ligula elit vel dolor. | Nam aliquet orci sit amet urna ultricies, a commodo velit bibendum. In justo ex, euismod non urna sit amet, suscipit feugiat nulla. Quisque ac nunc mauris. Vivamus sit amet hendrerit leo. Sed lobortis quam nec nulla porta, ac elementum arcu luctus. Donec tristique sem mi, auctor lobortis justo interdum in. | Nullam metus nisl, tempus hendrerit imperdiet sed, maximus et risus. Mauris mattis rutrum turpis ac venenatis. Phasellus tortor arcu, tincidunt sit amet laoreet a, bibendum vitae neque. Praesent vitae massa non justo accumsan efficitur a sit amet mi. |
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. | Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris. | In in rutrum odio, quis condimentum mauris. Ut nibh ante, imperdiet non fringilla vel, dictum sit amet diam. Nullam non volutpat mi, id consequat massa. Phasellus in purus ante. Sed blandit tortor eu pharetra volutpat. Fusce cursus, velit ut tristique imperdiet, ex libero egestas eros, sit amet euismod ligula elit vel dolor. | Nam aliquet orci sit amet urna ultricies, a commodo velit bibendum. In justo ex, euismod non urna sit amet, suscipit feugiat nulla. Quisque ac nunc mauris. Vivamus sit amet hendrerit leo. Sed lobortis quam nec nulla porta, ac elementum arcu luctus. Donec tristique sem mi, auctor lobortis justo interdum in. | Nullam metus nisl, tempus hendrerit imperdiet sed, maximus et risus. Mauris mattis rutrum turpis ac venenatis. Phasellus tortor arcu, tincidunt sit amet laoreet a, bibendum vitae neque. Praesent vitae massa non justo accumsan efficitur a sit amet mi. |
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. | Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris. | In in rutrum odio, quis condimentum mauris. Ut nibh ante, imperdiet non fringilla vel, dictum sit amet diam. Nullam non volutpat mi, id consequat massa. Phasellus in purus ante. Sed blandit tortor eu pharetra volutpat. Fusce cursus, velit ut tristique imperdiet, ex libero egestas eros, sit amet euismod ligula elit vel dolor. | Nam aliquet orci sit amet urna ultricies, a commodo velit bibendum. In justo ex, euismod non urna sit amet, suscipit feugiat nulla. Quisque ac nunc mauris. Vivamus sit amet hendrerit leo. Sed lobortis quam nec nulla porta, ac elementum arcu luctus. Donec tristique sem mi, auctor lobortis justo interdum in. | Nullam metus nisl, tempus hendrerit imperdiet sed, maximus et risus. Mauris mattis rutrum turpis ac venenatis. Phasellus tortor arcu, tincidunt sit amet laoreet a, bibendum vitae neque. Praesent vitae massa non justo accumsan efficitur a sit amet mi. |
So geht’s dann weiter im Text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Dies ist ein Beispiel einer Tabelle.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. | Ut varius ipsum ipsum, et accumsan ligula semper vel. | In in rutrum odio, quis condimentum mauris. Ut nibh ante, imperdiet non fringilla vel, dictum sit amet diam. | Nam aliquet orci sit. | Nullam metus nisl, tempus hendrerit imperdiet sed, maximus et risus. |
---|---|---|---|---|
56 | 12 | 18 | 22 | 27 |
41 | 57 | 68 | 19 | 11 |
56 | 12 | 18 | 22 | 27 |
So geht’s dann weiter im Text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Dies ist ein Beispiel einer Tabelle.
Anzahl | Stück | Preis | Gurkensalat | Pferde |
---|---|---|---|---|
56 | 12 | 18 | 22 | 27 |
41 | 57 | 68 | 19 | 11 |
56 | 12 | 18 | 22 | 27 |
So geht’s dann weiter im Text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
Dies ist ein Beispiel einer Tabelle.
Anzahl | Stück | Preis | Gurkensalat | Pferde |
---|---|---|---|---|
56 | 12 | 18 | 22 | 27 |
41 | 57 | 68 | 19 | 11 |
56 | 12 | 18 | 22 | 27 |
Anzahl | ||||
56 | 12 | 18 | 22 | 27 |
41 | 57 | 68 | 19 | 11 |
56 | 12 | 18 | 22 | 27 |
So geht’s dann weiter im Text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum.
<table> | Tabelle |
Tabellenstruktur | |
---|---|
<caption> | Titelbeschriftung einer Tabelle Optional, als erstes nach <table>. |
<colgroup> | Gruppe aus Tabellenspalten Optional, nach <caption> und vor <thead>, <tbody>, <tfoot>, <tr>. Nur ein Element pro Tabelle erlaubt. Wird genutzt, um Formate für Tabellenspalten festzulegen. Blöderweise erlaubt der CSS-Standard 2.1 nur das Setzen von border, background, width, and visibility, also nicht die wichtige Schriftformatierung oder -ausrichtung. |
<thead> | Überschrift der Tabellenspalten Optional, nach <caption>, <colgroup> und vor <tbody>, <tfoot>, <tr>. Nur ein Element pro Tabelle erlaubt. |
<tbody> | Tabellendaten Optional, nach <caption>, <colgroup>, <thead> und vor <tfoot>. Mehrere Elemente pro Tabelle erlaubt. Für Spaltenüberschriften innerhalb dieses Elements <th> nutzen, da <thead> nur einmal am Tabellenanfang vor <tbody> erlaubt ist. <th> kann auch für Zeilenüberschriften genutzt werden. Dieses Element ist zwar optional, aber auch wenn es nicht in einer Tabelle enthalten ist, werden alle Tabellenzeilen <tr> und Tabellenzellen <th> und <td> behandelt, als wenn sie innerhalb dieses Elementes stünden. Das heißt, für die Formatvorlage ist eine separate Formatfestlegung von <tr>, <th>, <td> einzeln und noch einmal speziell für <tbody> nicht sinnvoll. |
<tfoot> | Zusammenfassung der Tabellenspalten Optional, nach <caption>, <colgroup>, <thead>, <tbody>. Nur ein Element pro Tabelle erlaubt. |
Tabelleninhalt | |
<tr> | Tabellenzeile Innerhalb der Elemente <table>, <thead>, <tbody>, <tfoot>. Aus irgendwelchen Gründen erlaubt der CSS-Standard 2.1 das Setzen des Außenabstands (margin) und des Innenabstands (padding) nicht für dieses Element. Abstände in Tabellen daher immer mit Innenabstand (padding) in den einzelnen Tabellenzellen <th> und <td> setzen. |
<th> | Einzelne Tabellenüberschriftszelle Innerhalb des Elements <tr>. Sowohl für Spalten- als auch für Zeilenüberschriften. Mit dem Attribut colspan="x" erstreckt sich eine Zelle über mehrere Spalten, mit rowspan="x" über mehrere Zeilen. Da der CSS-Standard 2.1 das Setzen des Außenabstands (margin) und des Innenabstands (padding) nicht für die Tabellenzeilen <tr> erlaubt, Abstände immer mit Innenabstand (padding) in diesem Element und in <td> setzen. |
<td> | Einzelne Tabellenzelle Innerhalb des Elements <tr>. Mit dem Attribut colspan="x" erstreckt sich eine Zelle über mehrere Spalten, mit rowspan="x" über mehrere Zeilen. Da der CSS-Standard 2.1 das Setzen des Außenabstands (margin) und des Innenabstands (padding) nicht für die Tabellenzeilen <tr> erlaubt, Abstände immer mit Innenabstand (padding) in diesem Element und in <th> setzen. |
Hof 1 | Hof 3 | Hof 4 |
---|---|---|
Ringelschwanzaffe | Esel | Huhn |
Kuh | ||
Hund | Steinadler | Giraffe |
Hof 1 | Hof 3 | Hof 4 |
Ringelschwanzaffe | ||
Kuh | Schwein | Vampirtintenfisch |
Hund | Steinadler | Giraffe |
Eine weitere Überschrift | ||
Hof 1 | Hof 3 | Hof 4 |
Ringelschwanzaffe | Esel | Huhn |
Kuh | Schwein | Vampirtintenfisch |
Hund | Steinadler | Giraffe |
Eine weitere Überschrift | ||
---|---|---|
Hof 1 | Hof 3 | Hof 4 |
Ringelschwanzaffe | Esel | Huhn |
Kuh | Schwein | Vampirtintenfisch |
Hund | Steinadler | Giraffe |
Hof 1 | Hof 3 | Hof 4 |
Ringelschwanzaffe | Esel | Huhn |
Kuh | ||
Hund | Steinadler | Giraffe |
Eine weitere Überschrift | ||
Hof 1 | Hof 3 | Hof 4 |
Ringelschwanzaffe | Esel | Huhn |
Kuh | Schwein | Vampirtintenfisch |
Hund | Steinadler | Giraffe |
Hof 1 | Hof 3 | Hof 4 |
---|---|---|
Ringelschwanzaffe | Esel | Huhn |
Kuh | Schwein | Vampirtintenfisch |
Hund | Steinadler | Giraffe |
Ringelschwanzaffe | Esel | Huhn |
Kuh | Schwein | Vampirtintenfisch |
Hund | Steinadler | Giraffe |
Hof 1 | Hof 3 | Hof 4 |
Ringelschwanzaffe | Esel | Huhn |
Kuh | Schwein | Vampirtintenfisch |
Hund | Steinadler | Giraffe |
Eine weitere Überschrift | ||
Hof 1 | Hof 3 | Hof 4 |
Ringelschwanzaffe | Esel | Huhn |
Kuh | Schwein | Vampirtintenfisch |
Hund | Steinadler | Giraffe |
57 Tiere | 11 Tiere | 37 Tiere |
Eine weitere Überschrift | ||
---|---|---|
Hof 1 | Hof 3 | Hof 4 |
Ringelschwanzaffe | Esel | Huhn |
Kuh | Schwein | Vampirtintenfisch |
Hund | Steinadler | Giraffe |
Ringelschwanzaffe | Esel | Huhn |
Kuh | Schwein | Vampirtintenfisch |
Hund | Steinadler | Giraffe |
Hof 1 | Hof 3 | Hof 4 |
Ringelschwanzaffe | Esel | Huhn |
Kuh | Schwein | Vampirtintenfisch |
Hund | Steinadler | Giraffe |
Eine weitere Überschrift | ||
Hof 1 | Hof 3 | Hof 4 |
Ringelschwanzaffe | Esel | Huhn |
Kuh | Schwein | Vampirtintenfisch |
Hund | Steinadler | Giraffe |
57 Tiere | 11 Tiere | 37 Tiere |
57 Tiere | 11 Tiere | 37 Tiere |
gez. Anthon Ulrich
(LS)
gez. Anthon Ulrich
(LS)
So geht’s dann weiter im Text.
Ein Textteil einer Zeile links, der andere rechts.
Hier links. Hier rechts.
So geht’s dann weiter im Text.
Ein Textteil einer Zeile links, der andere ungefähr mittig.
Hier links.Hier mittig.
So geht’s dann weiter im Text.
Ein Textteil einer Zeile ungefähr mittig, der andere rechts.
Hier mittig.Hier rechts.
So geht’s dann weiter im Text.
The following 84 characters are permitted for URLs. All other characters, including spaces have to be encoded.
In der traditionellen Typografie werden für Fließtext die Textauszeichungen Fettsatz, Kursivsatz, Kapitälchensatz und Sperrsatz verwendet. Erlaubt die Darstellung auch Graustufen oder Farbe, kann Text auch durch die Schriftfarbe oder eine farbige Hinterlegung ausgezeichnet werden.
Weiterhin kann Text auch durch eine andere Schriftart oder eine unterschiedliche Schriftgröße hervorgehoben werden.
Typografisch missbilligte oder veraltete Auszeichungen sind Unterstreichungen und Versalsatz.
HMTL 5 stellt für das Webdesign noch weitere Auszeichnungsmöglichkeiten zur Verfügung. Dazu gehören die Kennzeichnungen von Computercode
, Kurzzitaten
und Werktiteln.
Satzzeichen, auch am Ende eines ausgezeichneten Textteils, werden in der Regel mit ausgezeichnet. Bindestrich, Gedankenstrich und Gleichheitszeichen werden in Verbindung mit Auszeichnungen immer mit ausgezeichnet. Ist der Text zwischen Anführungszeichen oder Klammern komplett ausgezeichnet, so werden auch die ihn umschließenden Zeichen ausgezeichnet gesetzt. Ist nur ein Teil des Textes ausgezeichnet, so werden die umschließenden Zeichen nicht ausgezeichnet – auch wenn ein ausgezeichnetes Wort am Anfang oder Ende steht.
Wilhelm Raabe schrieb „Das Odfeld“, einen historischen Roman.
Wilhelm Raabe schrieb „Das Odfeld“, einen historischen Roman.
Der Roman „Das Odfeld“ (von Wilhelm Raabe) spielt im Siebenjährigen Krieg.
Wilhelm Raabes bester Roman (Das Odfeld) spielt im Siebenjährigen Krieg.
Fettsatz gehört zu den sogenannten lauten, optischen oder visuellen Schriftauszeichnungen, die auf den ersten Blick erkannt werden können, weil sie den Grauwert verändern und sich vom Fließtext abheben.
Beispiel: Raabe hat den Roman Das Odfeld geschrieben.
Webdesign/HTML5
Das Element „strong“ kennzeichnet wichtigen Text, welcher standardmäßig fett dargestellt wird.
<strong>
XFettX</strong>
Derselbe visuelle Effekt kann in HTML5 auch mit dem Attribut „style“ und der Eigenschaft „font-weight“ erreicht werden.
<span style="font-weight: bold">
XFettX</span>
Mögliche Werte sind neben anderen bold
und normal
.
In älteren HTML-Versionen wurde das Element „b“ genutzt.
Beispiel: Raabe hat den Roman Das Odfeld geschrieben.
Webdesign/HTML5
Das Element „em“ (für englisch „emphasised“, betont) kennzeichnet betonten Text, welcher standardmäßig kursiv dargestellt wird.
<em>
XKursivX</em>
Derselbe visuelle Effekt kann in HTML5 auch mit dem Attribut „style“ und der Eigenschaft „font-style“ erreicht werden.
<span style="font-style: italic">
XKursivX</span>
Mögliche Werte sind neben anderen italic
und normal
.
In älteren HTML-Versionen wurde das Element „i“ genutzt.
Kapitälchen haben die Form von Großbuchstaben, sind aber in Größe, Strichstärke und Grauwert an Kleinbuchstaben angepasst. Dadurch ergibt sich ein ruhiges, elegantes Schriftbild. Echte Kapitälchen sind speziell für eine Schriftart entworfene Zeichen, falsche Kapitälchen hingegen nur verkleinerte Großbuchstaben.
Beispiel: Raabe hat den Roman Das Odfeld geschrieben.
Webdesign/HTML5
Diese Auszeichnung wird mit dem Attribut „style“ und der Eigenschaft „font-variant“ vorgenommen. Sie ist nur optisch und hat keine weitere Bedeutung.
<span style="font-variant: small-caps">
XKapitälchenX</span>
Sperren, auch spationieren, ist die Textauszeichnung durch Vergrößerung der Buchstabenabstände.
Beim Sperren werden traditionell Leerzeichen vor und nach dem gesperrten Text mitgesperrt, Satzzeichen außer Punkt und Anführungszeichen ebenfalls. Ziffern werden nicht gesperrt. Sperren wird üblicherweise mit einem Achtelgeviert (0,125 Geviert) durchgeführt. Beim Webdesign allerdings scheint ein Fünftelgeviert (0,2 Geviert) eine bessere optische Wirkung zu haben. Aufgrund der erschwerten Lesbarkeit sollten nicht mehr als drei bis fünf Wörter gesperrt werden. Früher häufiger angewandt, speziell bei Frakturschriften, wird die Sperrschrift heute meist durch Fett- oder Kursivschrift ersetzt. Im Fraktursatz werden die Ligaturen ch, ck und tz nicht mitgesperrt. Sperren war, neben dem Unterstreichen, eine der beiden einzigen Auszeichnungsarten, welche bei mechanischen Schreibmaschinen zur Verfügung.
Beispiel: Raabe hat den Roman Das Odfeld geschrieben.
Webdesign/HTML5
Diese Auszeichnung wird mit dem Attribut „style“ und der Eigenschaft „letter-spacing“ vorgenommen. Sie ist nur optisch und hat keine weitere Bedeutung.
<span style="letter-spacing: 0.2em">
XSperrsatzX</span>
Diese Auszeichnung kann auch auch für Absätze genutzt werden.
Beispiel: Raabe hat den Roman Das Odfeld geschrieben.
Webdesign/HTML5
Das Element „mark“ kennzeichnet Text als markiert oder hervorgehoben, welcher standardmäßig in schwarzer Schriftfarbe auf gelbem Hintergrund dargestellt wird.
<mark>
XHinterlegungX</mark>
Alternativ kann das Attribut „style“ genutzt werden. Es wirkt nur optisch und hat keine weitere Bedeutung.
<span style="background-color: gold">
XHinterlegungX</span>
Textfarben zur Auszeichnung sollten im Internet nur eingesetzt werden, wenn klar von Links unterschieden werden kann. Diese Auszeichnung kann auch auch für Absätze genutzt werden.
Beispiel: Raabe hat den Roman Das Odfeld geschrieben.
Webdesign/HTML5
Farbauszeichnung wird mit dem Attribut „style“ und der Eigenschaft „color“ vorgenommen. Sie ist nur optisch und hat keine weitere Bedeutung.
<span style="color: green">
XTextfarbeX</span>
Farbwerte können mit vordefinierten Farbnamen (mediumslateblue
) oder als RGB-Farben in Dezimal- (rgb(255, 99, 71)
) oder Hexadezimalschreibweise (#ff6347
) angegeben werden.
Unterstreichungen sind ein Überbleibsel aus der Schreibmaschinenzeit und werden für gute Typografie nicht verwendet.
Beim Unterstreichen werden Wortzwischenräume und Satzzeichen der unterstrichenen Wörter mit unterstrichen (nicht aber Leerzeichen vor und nach unterstrichenen Textteilen). Im Internet sollten Unterstreichungen nur eingesetzt werden, wenn klar von Links unterschieden werden kann.
Unterstreichen mit „style“.
Webdesign/HTML5
Diese Auszeichnung wird mit dem Attribut „style“, der Eigenschaft „text-decoration“ und dem Wert „underline“ vorgenommen. Sie ist nur optisch und hat keine weitere Bedeutung.
<span style="text-decoration: underline">
XUnterstreichenX</span>
In älteren HTML-Versionen wurde das Element „u“ genutzt.
Versalsatz ist das Schreiben in Großbuchstaben. Versalsatz wird für gute Typografie im Fließtext aufgrund der schlechten Lesbarkeit und des störenden Textbildes nicht verwendet. Häufig wird Versalsatz auch als aufdringlich empfunden. Für Schlagzeilen und Werbezwecke wird Versalsatz benutzt, um Aufmerksamkeit zu erzielen. Aufgrund der schlechten Lesbarkeit sollten nicht mehr als drei bis fünf Wörter in Großbuchstaben gesetzt werden.
Versalsatz mit „style“.
Webdesign/HTML5
Versalsatz wird mit dem Attribut „style“, der Eigenschaft „text-transform“ und dem Wert „uppercase“ vorgenommen. Er ist nur optisch und hat keine weitere Bedeutung.
<span style="text-transform: uppercase">
XVersalsatzX</span>
Hochgestellte Zeichen werden von der Schriftlinie erhöht und meist etwas verkleinert dargestellt.
Beispiel: Die Formel E = m ⋅ c2 stammt von Einstein.
Webdesign/HTML5
Das Element „sup“ (kurz für „superscript“, englisch für Hochstellung) kennzeichnet höhergestellten Text, welcher standardmäßig hochgestellt und in einer kleineren Schriftgröße dargestellt wird.
<sup>
XHochstellungX</sup>
Hochgestellter Text wird mit dem CSS-Wert „smaller“ dargestellt, welcher die Schriftgröße um ⅙ reduziert, also Text mit etwa 83,33 Prozent der Größe des Elternelements darstellt.
Tiefgestellte Zeichen werden von der Schriftlinie nach unten versetzt und meist etwas verkleinert dargestellt.
Beispiel: Die Formel H20 steht für Wasser.
Webdesign/HTML5
Das Element „sub“ (kurz für „subscript“, englisch für Tiefstellung) kennzeichnet tiefergestellten Text, welcher standardmäßig tiefgestellt und in einer kleineren Schriftgröße dargestellt wird.
<sub>
XTiefstellungX</sub>
Tiefgestellter Text wird mit dem CSS-Wert „smaller“ dargestellt, welcher die Schriftgröße um ⅙ reduziert, also Text mit etwa 83,33 Prozent der Größe des Elternelements darstellt.
Durchstreichen eines Textes gilt als Tilgung oder Löschung, es zeigt eine ältere oder korrigierte Textversion an.
Beispiel: Raabe wurde in Braunschweig in Eschershausen geboren.
Webdesign/HTML5
Das Element „del“ (kurz für „delete“, englisch für tilgen) kennzeichnet gelöschten Text, welcher standardmäßig durchgestrichen dargestellt wird.
<del>
XDurchstreichenX</del>
–
Beispiel: Mit dem Befehl print
kann man drucken.
Webdesign/HTML5
Das Element „code“ kennzeichnet Computercode, welcher standardmäßig in einer nichtproportionalen Schriftart dargestellt wird.
<code>
XComputercodeX</code>
–
Beispiel: Raabe hat den Roman Das Odfeld geschrieben.
Webdesign/HTML5
Das Element „cite“ (englisch für zitieren) kennzeichnet den Titel eines Werkes, welcher standardmäßig kursiv dargestellt wird.
<cite>
XWerktitelX</cite>
Zitate werden üblicherweise in Anführungszeichen eingeschlossen. HTML 5 bietet ein semantisches Element, um Zitate zu markieren. Die Anführungszeichen werden dadurch zwar angezeigt, sind aber im Quelltext nicht vorhanden, wodurch das Kopieren von Text erschwert wird.
Beispiel: Das Zitat Frei durchgehen!
stammt von Wilhelm Raabe.
Webdesign/HTML5
Das Element „q“ (kurz für „quote“, englisch für Zitat) kennzeichnet ein Zitat, welches standardmäßig mit umschließenden Anführungszeichen dargestellt wird.
<q>
XKurzzitatX</q>
Längere Zitate, die in einem eigenen Absatz dargestellt werden, können zur Kennzeichnung eingerückt werden.
Beispiel: Schrift kann in unterschiedlichen Größen dargestellt werden.
Webdesign/HTML5
Das Element „blockquote“ kennzeichnet ein längeres Zitat, welches standardmäßig als eingerückter Absatz dargestellt wird. Innerhalb dieses Blockelements können verschiedene Absätze enthalten sein, die mit „p“ voneinander abgegrenzt werden. „Blockquote“-Elemente innerhalb von „p“-Absatzelementen sind nicht zulässig.
<blockquote>
XSchriftgrößeX</blockquote>
Standardmäßig sind rechts und links Ränder von 40 Pixeln eingestellt.
–
Beispiel: Text kann in unterschiedlichen Schriftarten dargestellt werden.
Webdesign/HTML5
Die Schriftart wird mit dem Attribut „style“ und der Eigenschaft „font-family“ festgelegt, welches nur eine optische Bedeutung hat.
<span style="font-family: Helvetica, Arial, sans-serif">
XSchriftartX</span>
Generische Schriftfamilien sind serif
, sans-serif
, monospace
(Festbreitenschrift), cursive
(Schreibschrift) und fantasy
.
Als im Internet sicher verfügbare Schriftarten gelten: Arial, Verdana, Tahoma, 'Trebuchet MS' (alle serifenlos), 'Times New Roman', Georgia, Garamond (alles Serifenschriften), 'Courier New' (nichtproportional) und 'Brush Script MT' (handschriftlich).
Für Schriftarten können ein einziger Wert oder mehrere durch Kommas getrennte Werte angegeben werden. Die erste verfügbare Schriftart aus der Auflistung wird angezeigt. Zur Sicherheit sollte am Ende der Aufzählung eine generische Schriftfamilie stehen.
–
Beispiel: Schrift kann in unterschiedlichen Größen dargestellt werden.
Webdesign/HTML5
Die Schriftgröße wird mit dem Attribut „style“ und der Eigenschaft „font-size“ festgelegt, welches nur eine optische Bedeutung hat.
<span style="font-size: large">
XSchriftgrößeX</span>
Mit den Werten xx-small
, x-small
, small
, medium
, large
, x-large
, xx-large
können sieben verschiedene Schriftgrößen gesetzt werden. Zudem können Größenangaben auch in Gevierten (em oder rem), Prozent (%), Pixeln (px) und anderen Einheiten gemacht werden.
Schriftgrößenstandard ist medium = 1 em = 100% = 16px.
–
Beispiel: Schrift kann in unterschiedlichen Größen dargestellt werden.
Webdesign/HTML5
Das Element „small“ kennzeichnet kleinere Schrift, wie Randkommentare oder andere Hinweise.
<small>
XKleinschriftX</small>
Mit dem Element „small“ gekennzeichneter Text wird mit dem CSS-Wert „smaller“ dargestellt, welcher die Schriftgröße um ⅙ reduziert, also Zeichen mit etwa 83,33 Prozent der Größe des Elternelements darstellt.
Absätze können zentriert (mittig), linksbündig, rechtsbündig oder im Blocksatz dargestellt werden.
Beispiel: Schrift kann in unterschiedlichen Größen dargestellt werden.
Webdesign/HTML5
Absätze werden mit dem Attribut „style“ und der Eigenschaft „text-align“ ausgerichtet, welches nur eine optische Bedeutung hat.
<p style="text-align: justify">
XAbsatzX</p>
Werte können center
, justify
, left
und right
sein.
Ein Einzug ist ein Leerraum zu Beginn der ersten Zeile eines Absatzes. Laut Wikipedia galten früher im Werksatz zwei Gevierte als größter zulässiger Einzug, heute ist ein Geviert üblich.
Beispiel: Schrift kann in unterschiedlichen Größen dargestellt werden.
Webdesign/HTML5
Einzüge werden mit dem Attribut „style“ und der Eigenschaft „text-indent“ definiert, welches nur eine optische Bedeutung hat.
<p style="text-indent: 1.5em">
XEinzugX</p>
Größenangaben können auch in Pixeln (px), Gevierten (em), Prozent (%), Zentimetern (cm), Millimeter (mm), Punkten (pt) und anderen Einheiten gemacht werden. Schriftgrößenstandard ist 100% = 16px = 1em.
Absätze können eingerückt werden, das heißt mit einem größeren Absatz zum linken Rand dargestellt werden.
Beispiel: Raabe hat den Roman „Das Odfeld“ geschrieben.
Webdesign/HTML5
Absätze werden mit dem Attribut „style“ und der Eigenschaft „margin-left“ eingerückt, welches nur eine optische Bedeutung hat.
<p style="margin-left: 1.5em">
XEinrückenX</p>
Größenangaben können auch in Pixeln (px), Gevierten (em), Prozent (%), Zentimetern (cm), Millimeter (mm), Punkten (pt) und anderen Einheiten gemacht werden. Schriftgrößenstandard ist 100% = 16px = 1em.
Die Basislängeneinheit für die Formatvorlagensprache CSS ist der Pixel. Andere absolute Längeneinheiten werden im Webdesign normalerweise nicht verwendet.
Für die CSS-Eigenschaft Schriftgröße sind sieben benannte Werte definiert:
<span style="font-size: large">
XSchriftgrößeX</span>
Wert | Pixel px | Geviert em | Prozent % |
---|---|---|---|
xx-small | 9px | 0.5625em | 56.25% |
x-small | 10px | 0.6250em | 62.50% |
small | 13px | 0.8125em | 81.25% |
medium | 16px | 1.0000em | 100.00% |
large | 18px | 1.1250em | 112.50% |
x-large | 24px | 1.5000em | 150.00% |
xx-large | 32px | 2.0000em | 200.00% |
Als relative Längeneinheit eignet sich das Geviert, welches sich auf die Schriftgröße bezieht. Gevierte können relativ zum eigenen oder Elternelement in em angegeben werden, oder relativ zum Grundelement in rem.
1em
) ist identisch mit der Elternelement-Schriftgröße, größere oder kleinere Wertangaben verändern die Größe im gleichen Verhältnis. Als Beispiel erhöht 1,5 Geviert (1.5em
) die Schriftgröße um 50 Prozent. Als Maßeinheit sind Gevierte ideal für ein skalierbares Layout nach den Bedürfnissen des Nutzers.<html>
) definierten Schriftgröße. Standardmäßig liegt diese bei 16 Pixel oder einem Geviert (16px
= 1em
= 100%
= medium
). Als Maßeinheit sind Gevierte ideal für ein skalierbares Layout nach den Bedürfnissen des Nutzers.<html>
) definierten Zeilenhöhe. Standardmäßig liegt diese bei dem CSS-Wert „normal“ (line-height: normal
). Der Standardwert hängt von der jeweiligen Schriftart und dem Browser ab, meist liegt er bei oder knapp unter 1,2 Geviert (1.2em
).100%
) identisch mit der Elternelement-Schriftgröße, größere oder kleinere Wertangaben verändern die Größe im gleichen Verhältnis. Als Beispiel erhöht 150 Prozent (150%
) die Schriftgröße um 50 Prozent.83.33%
).120%
).Pixel | Geviert | Prozent | Wert | Beispiel | Kommentar |
---|---|---|---|---|---|
1px | 0.0625em | 6.25% | – | Eschershausen | |
2px | 0.1250em | 12.50% | – | Eschershausen | |
3px | 0.1875em | 18.75% | – | Eschershausen | |
4px | 0.2500em | 25.00% | – | Eschershausen | |
5px | 0.3125em | 31.25% | – | Eschershausen | |
6px | 0.3750em | 37.50% | – | Eschershausen | |
7px | 0.4375em | 43.75% | – | Eschershausen | |
8px | 0.5000em | 50.00% | – | Eschershausen | |
9px | 0.5625em | 56.25% | xx-small | Eschershausen | |
10px | 0.6250em | 62.50% | x-small | Eschershausen | |
11px | 0.6875em | 68.75% | – | Eschershausen | Ungefährer Standardwert für Überschrift sechster Ordnung <h6> (exakt 0.67em). |
12px | 0.7500em | 75.00% | – | Eschershausen | |
13px | 0.8125em | 81.25% | small | Eschershausen | Ungefährer Standardwert für Überschrift fünfter Ordnung <h5> (exakt 0.83em). |
14px | 0.8750em | 87.50% | – | Eschershausen | |
15px | 0.9375em | 93.75% | – | Eschershausen | |
16px | 1.0000em | 100.00% | medium | Eschershausen | Standardschriftgröße. |
17px | 1.0625em | 106.25% | – | Eschershausen | |
18px | 1.1250em | 112.50% | large | Eschershausen | |
19px | 1.1875em | 118.75% | – | Eschershausen | Ungefährer Standardwert für Überschrift dritter Ordnung <h3> (exakt 1.17em). |
20px | 1.2500em | 125.00% | – | Eschershausen | |
21px | 1.3125em | 131.25% | – | Eschershausen | Ungefährer Standardwert für Überschrift vierter Ordnung <h4> (exakt 1.33em). |
22px | 1.3750em | 137.50% | – | Eschershausen | |
23px | 1.4375em | 143.75% | – | Eschershausen | |
24px | 1.5000em | 150.00% | x-large | Eschershausen | Standardwert für Überschrift zweiter Ordnung <h2> . |
25px | 1.5625em | 156.25% | – | Eschershausen | |
26px | 1.6250em | 162.50% | – | Eschershausen | |
27px | 1.6875em | 168.75% | – | Eschershausen | |
28px | 1.7500em | 175.00% | – | Eschershausen | |
29px | 1.8125em | 181.25% | – | Eschershausen | |
30px | 1.8750em | 187.50% | – | Eschershausen | |
31px | 1.9375em | 193.75% | – | Eschershausen | |
32px | 2.0000em | 200.00% | xx-large | Eschershausen | Standardwert für Überschrift erster Ordnung <h1> . |
33px | 2.0625em | 206.25% | – | Eschershausen | |
34px | 2.1250em | 212.50% | – | Eschershausen | |
35px | 2.1875em | 218.75% | – | Eschershausen | |
36px | 2.2500em | 225.00% | – | Eschershausen | |
48px | 3.0000em | 300.00% | – | Eschershausen |
– | 1 Pixel px | 1 Geviert em | 1 Prozent % |
---|---|---|---|
= Pixel | 1.00px | 16.00px | 0.16px |
= Geviert | 0.0625em | 1.0000em | 0.0100em |
= Prozent | 6.25% | 100.00% | 1.00% |
Beispiel q: Hier gibt es das Zitat Auch wenn man nur zum Fenster rausschaut, sieht man die Welt.
von Wilhelm Raabe.
Beispiel q: Hier gibt es das Zitat mit Quellenangabe Auch wenn man nur zum Fenster rausschaut, sieht man die Welt.
von Wilhelm Raabe.
Beispiel blockquote: Hier gibt es ein sogenanntes Block-Zitat.
Quisque facilisis tincidunt felis ac dignissim. Integer quis quam risus. Nam consequat mattis lectus, ac suscipit elit sagittis et. Proin consectetur erat nec efficitur euismod. Nunc metus ex, lacinia nec velit eget, suscipit porttitor massa. Curabitur posuere augue metus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse urna mi, maximus a ipsum sit amet, finibus dapibus orci. Mauris at ultricies orci, sed ultricies augue. Morbi vitae turpis vel quam sagittis porta. Maecenas sed arcu pulvinar, vehicula massa pretium, vehicula felis. Pellentesque et dui lacus. Nulla pulvinar sollicitudin quam sed maximus. Suspendisse potenti. Nullam eleifend commodo arcu, ut dapibus ipsum sodales at. Nulla nec efficitur nulla, quis aliquet urna.
So geht’s dann weiter im Text.
Beispiel blockquote: Hier gibt es ein sogenanntes Block-Zitat mit Quellenangabe.
Quisque facilisis tincidunt felis ac dignissim. Integer quis quam risus. Nam consequat mattis lectus, ac suscipit elit sagittis et. Proin consectetur erat nec efficitur euismod. Nunc metus ex, lacinia nec velit eget, suscipit porttitor massa. Curabitur posuere augue metus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse urna mi, maximus a ipsum sit amet, finibus dapibus orci. Mauris at ultricies orci, sed ultricies augue. Morbi vitae turpis vel quam sagittis porta. Maecenas sed arcu pulvinar, vehicula massa pretium, vehicula felis. Pellentesque et dui lacus. Nulla pulvinar sollicitudin quam sed maximus. Suspendisse potenti. Nullam eleifend commodo arcu, ut dapibus ipsum sodales at. Nulla nec efficitur nulla, quis aliquet urna.
So geht’s dann weiter im Text.
Beispiel margin-left: Hier gibt es eingerückten Text.
Quisque facilisis tincidunt felis ac dignissim. Integer quis quam risus. Nam consequat mattis lectus, ac suscipit elit sagittis et. Proin consectetur erat nec efficitur euismod. Nunc metus ex, lacinia nec velit eget, suscipit porttitor massa. Curabitur posuere augue metus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse urna mi, maximus a ipsum sit amet, finibus dapibus orci. Mauris at ultricies orci, sed ultricies augue. Morbi vitae turpis vel quam sagittis porta. Maecenas sed arcu pulvinar, vehicula massa pretium, vehicula felis. Pellentesque et dui lacus. Nulla pulvinar sollicitudin quam sed maximus. Suspendisse potenti. Nullam eleifend commodo arcu, ut dapibus ipsum sodales at. Nulla nec efficitur nulla, quis aliquet urna.
So geht’s dann weiter im Text.
Beispiel text-indent: Hier gibt Text mit Einzug.
Quisque facilisis tincidunt felis ac dignissim. Integer quis quam risus. Nam consequat mattis lectus, ac suscipit elit sagittis et. Proin consectetur erat nec efficitur euismod. Nunc metus ex, lacinia nec velit eget, suscipit porttitor massa. Curabitur posuere augue metus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse urna mi, maximus a ipsum sit amet, finibus dapibus orci. Mauris at ultricies orci, sed ultricies augue. Morbi vitae turpis vel quam sagittis porta. Maecenas sed arcu pulvinar, vehicula massa pretium, vehicula felis. Pellentesque et dui lacus. Nulla pulvinar sollicitudin quam sed maximus. Suspendisse potenti. Nullam eleifend commodo arcu, ut dapibus ipsum sodales at. Nulla nec efficitur nulla, quis aliquet urna.
So geht’s dann weiter im Text.
Quisque facilisis tincidunt felis ac dignissim. Integer quis quam risus. Nam consequat mattis lectus, ac suscipit elit sagittis et. Proin consectetur erat nec efficitur euismod. Nunc metus ex, lacinia nec velit eget, suscipit porttitor massa. Curabitur posuere augue metus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse urna mi, maximus a ipsum sit amet, finibus dapibus orci. Mauris at ultricies orci, sed ultricies augue. Morbi vitae turpis vel quam sagittis porta. Maecenas sed arcu pulvinar, vehicula massa pretium, vehicula felis. Pellentesque et dui lacus. Nulla pulvinar sollicitudin quam sed maximus. Suspendisse potenti. Nullam eleifend commodo arcu, ut dapibus ipsum sodales at. Nulla nec efficitur nulla, quis aliquet urna.
Lorem ipsum dolor sit amet, consectetur
Lorem ipsum dolor sit amet, consectetur
Lorem ipsum dolor sit amet, consecteturBeispiel für eine Fußnote? adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Lorem ipsum dolor sit amet, consecteturBeispiel für eine Fußnote? adipiscing elit. In ac maximus magna, pharetra efficitur urna. Quisque pellentesque dolor in lorem porta elementum. In hac habitasse platea dictumst. Nam rutrum risus erat, accumsan tincidunt erat egestas vel. Curabitur nibh libero, dapibus at libero at, vestibulum viverra lorem. In vehicula ornare metus, non commodo felis efficitur rutrum. Ut varius ipsum ipsum, et accumsan ligula semper vel. Nunc elementum vel dui a imperdiet. Integer rhoncus dignissim urna, vitae gravida mauris. Pellentesque laoreet eget dui nec eleifend. Donec ac mattis sapien. Vestibulum quis diam hendrerit, faucibus neque ut, vehicula mauris.
Das Buch ist in dunkelgrünes Ganzleinen gebunden und enthält 214 Seiten.
In der modernisierten Version sind Schreib- und Satzfehler korrigiert, die meisten Abkürzungen ausgeschrieben, die Schreibweisen und Zeichensetzung, außer in historischen Zitaten, an die aktuelle Rechtschreibung angepasst und einige stilistische Änderungen vorgenommen (beispielsweise Zahlwörter statt Ziffernschreibweise). Schriftauszeichnungen wurden vom Original übernommen.
Die Digitalisierung des Textes und der Bilder stammt von Martin Lucé, Eschershausen, aus dem Jahr 2020. Als Vorlage diente eine Originalausgabe aus Familienbesitz.
Bearbeitungsstand: Die Fußnoten wurden noch nicht in das Digitalisat übertragen, Formatierungen, Absätze und Bildpositionen sind noch zu überprüfen. Bilder werden noch beschnitten und in höherer Auflösung zur Verfügung gestellt.
Christian Kaese
Eschershausen 2020