Moin Leute!
Ich bin gerade fertig mit meiner Seite und habe nun den Befehl bekommen, das Printmodell in A6 auszugeben (vorher A4). Ich dachte, wenn ich bei @page von A4 auf A6 umstelle, geht das, aber denkste. Er verkleinert die Seiten, aber die Schriften bleiben unverändert groß.
Wie schaffe ich das, dass der ganze Text flexibel gestaltet werden kann?
Ist es möglich mitten im Hochformattext auf Querformat umzustellen (das wird danach die nächste Aufgabe sein) und dann wieder auf Hochformat?
Hier noch mal mein CSS:
#ekblogo,
#portal-globalnav,
#portal-personaltools,
#portal-column-one,
#portal-column-two,
#portal-breadcrumbs,
#portal-footer,
#kss-spinner,
#banner,
#sea-mandant,
#logo-right,
.contentViews,
.contentActions,
.hiddenStructure,
.documentByLine,
.documentActions,
.portletWrapper{
display: none;
}
@page
{
size: A4;
margin: 20mm 20mm 20mm 20mm;
@top-left {
font-family: Verdana, Lucida, sans-serif;
font-size: 10pt;
}
@top {
content: string(doctitle);
font-family: Verdana, Lucida, sans-serif;
font-size: 10pt;
border-bottom: 1px solid black;
margin-bottom: 20px;
}
@top-right {
content: string(mand);
font-family: Verdana, Lucida, sans-serif;
font-size: 10pt;
}
@bottom {
font-family: Verdana, Lucida, sans-serif;
font-size: 10pt;
content: counter(page);
}
}
@page:first { /*erste Seite mit dem Deckblatt soll normal sein*/
@top {
content: normal;
}
@bottom {
content: normal;
}
}
body
{
background-color: #ffffff;
font-family: Verdana, Lucida, sans-serif;
counter-reset: Ebene01;
}
#inhalt a::after {
content: leader(' ') target-counter(attr(href), page);
}
.documentFirstHeading {
text-align: center;
font-size: 25pt;
}
/*Liste wird nach links gesetzt, der besseren lesbarkeit wegen*/
ol.arabic1 {
margin-left: 16px;
counter-reset: arabic2;
list-style-type:none;
}
/*Listenpunkte werden generiert*/
ol.arabic1 li:before { /*1. Ebene der Liste*/
content: counter(arabic1) " ";
counter-increment: arabic1;
}
/*Quelle: http://www.luk-korbmacher.de/Schule/Text/din5008_12.htm*/
ol.arabic2{
margin-left: 42px;
margin-bottom: 15px; /*sorgt für Abstand nach den großen Überschriften*/
counter-reset: arabic2;
list-style-type:none;
}
ol.arabic2 li:before { /*2. Ebene der Liste*/
content: counter(arabic1) "." counter(arabic2) " ";
counter-increment: arabic2;
}
ol.arabic3 {
margin-left: 61px;
counter-reset: arabic3;
list-style-type: none;
}
ol.arabic3 li:before { /*3. Ebene der Liste*/
content: counter(arabic1) "." counter(arabic2) "." counter(arabic3) " ";
counter-increment: arabic3;
}
ol.arabic4 {
margin-left: 77px;
counter-reset: arabic4;
list-style-type: none;
}
ol.arabic4 li:before { /*4. Ebene der Liste*/
content: counter(arabic1) "." counter(arabic2) "." counter(arabic3) "." counter(arabic4) " ";
counter-increment: arabic4;
}
/*Dokumentenüberschriften werden festgelegt*/
h3, h2 {
string-set: doctitle content();
page-break-before: always;
font-size: 18pt;
}
/*Überschriften bekommen Nummern zugewiesen! Darauf achten, dass alle, die keine Nummer haben sollen mit <h2> definiert sind*/
h3:before {
content: counter(Ebene01) " ";
counter-increment: Ebene01;
}
h3 {
counter-reset: Ebene02;
}
h4 {
font-size: 16pt;
counter-reset: Ebene03;
}
h4:before {
content: counter(Ebene01) "." counter(Ebene02) " ";
counter-increment: Ebene02;
}
h5 {
font-size: 14pt;
counter-reset: Ebene04;
}
h5:before {
content: counter(Ebene01) "." counter(Ebene02) "." counter(Ebene03) " ";
counter-increment: Ebene03;
}
h6 {
font-size: 12pt;
}
h6:before {
content: counter(Ebene01) "." counter(Ebene02) "." counter(Ebene03) "." counter(Ebene04) " ";
counter-increment: Ebene04;
}
table {
border-collapse: collapse;
margin-top: 20px;
}
.field,
.field-body {
border: 1px solid black;
}
.field-name {
text-align: left;
vertical-align: top;
padding-top: 15px;
}
.field-body {
padding: 0px 15px 0px 20px;
page-break-inside: avoid;
text-align: left;
}
.field-body p {
padding-left: 38px;
}
.field-body ul {
padding-top: 15px;
padding-bottom: 15px;
}
.field-body img {
height: auto;
padding-top: 10px;
}
th {
padding: 0px 10px 0px 10px;
background-color: #F5F5F5;
}
a {
color: black;
text-decoration: none;
}
li {
margin-left: -15px;
}
dt {
margin-bottom: 5px;
font-size: 12pt;
}
dd {
margin-left: 0px;
}
.danger > .first {
display: none;
}
.danger > .last {
font-weight: bold;
color: red;
}
.label {
padding-right: 15px;
}
Entschuldigung, wenn es so viel ist, aber ich weiß nicht, was für die Änderung bedeutend ist.
Danke für eure Mühe!
Gruß Dina