Page tree

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Korrespondenzen, die als E-Mail versendet werden können aus verschiedenen Elementen zusammengestellt werden.

Im einfachsten Fall enthält eine Korrespondenz nur ein Textelement. Dieses wird dann mit dem folgenden HTML-Code zu eine Multipart-Nachricht verarbeitet.

In der E-Mail ist also 

 

Code Block
languagexml
themeMidnight
firstline1
titleBeispiel Mailstruktur
linenumberstrue
<body>
	<div class="sdw_head"></div>

...


	<div class="sdw_

...

plain">
		Beispieltext für die ganze Breite
		<div class="sdw_right">Beispieltext rechtsbündig</div>
		<h1>Uberschriften Ebene 1</h1>
		<h2>Uberschriften Ebene 1</h2>
		<h3>Uberschriften Ebene 1</h3>
	</div>
	<div class="sdw_row">
		<div class="sdw_cell sdw_colstyle_w20"

...

><em>Label-Spalte</em></div>
		<div class="sdw_cell sdw_colstyle_w80">Inhaltsspalte</div>
	</div>
	<div class="sdw_row">
	<!-- weitere Zeilen möglich -->
	</div>
 
	<div class="sdw_foot">Verweis auf die Anwendung</div>
</body>

 

 

Code Block
languagecss
titleBeispiel-CSS
  body {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1em;
	background-image:
		url("data:image/svg+xml;utf8,<svg>[Bildinformationen]</svg>");
	background-attachment: fixed;
	background-position: bottom right;
	background-repeat: no-repeat;
	background-size: 30%;
	margin-left: 2em;
	margin-right: 4em;
	max-width: 900px;}

.sdw_row { display: flex;}

.sdw_cell {
	border-color: grey;
	border-style: solid;
	padding: 3px}

.sdw_colstyle_w10 { flex-basis: 10%}

.sdw_colstyle_w20 { flex-basis: 20%}

.sdw_colstyle_w30 { flex-basis: 30%}

.sdw_colstyle_w40 { flex-basis: 40%}

.sdw_colstyle_w50 { flex-basis: 50%}

.sdw_colstyle_w60 { flex-basis: 60%}

.sdw_colstyle_w70 { flex-basis: 70%}

.sdw_colstyle_w80 { flex-basis: 80%}

.sdw_colstyle_w90 { flex-basis: 90%}

.sdw_right { text-align: right;}

.sdw_foot {
	text-align: center;
	font-size: 0.8em;
	margin-top: 2em;
	padding-top: 1em;
	padding-bottom: 1em;
	background-color: #cccccc;}

.sdw_foot a {
	text-decoration: none;
	color: #d36f16}

...