Difference between revisions of "Courses/Design & Technique-Essential Web Design/CSS4print"
(Created page with "To make a PDF, print the page within the browser, and choose «Print to file». Important: choose the right page format (only Chromium's print preview can take the format sp...") |
|||
| Line 1: | Line 1: | ||
==HTML to print== | |||
HTML to print allow you to create print layouts for your web pages. | |||
You can create a PDF from you page, by print the page within the browser, and choose «Print to file». | |||
==CCS for print== | |||
Specific CSS rules allow you to specify how a webpage that was designed for screens, will be displayed in a page layout. | |||
== @page== | == @page== | ||
@page rule defines context for printing. | |||
It describes the characteristic of sheet where web page is going to be printed on. | |||
* the margins | |||
== @page property: size== | |||
Possible values size: A5, A4, A3, landscape, portrait | |||
Note: Only Chromium's print preview can take the format specified by the CSS | |||
@page { | |||
size: A4 landscape; | |||
} | |||
http://www.w3.org/TR/css3-page/#page-size | |||
* the margins | |||
* orphans, | * orphans, | ||
* widows, | * widows, | ||
| Line 14: | Line 32: | ||
https://developer.mozilla.org/en/docs/Web/CSS/@page | https://developer.mozilla.org/en/docs/Web/CSS/@page | ||
Important: choose the right page format (). | |||
page-break-before | page-break-before | ||
Revision as of 17:08, 4 October 2015
HTML to print
HTML to print allow you to create print layouts for your web pages.
You can create a PDF from you page, by print the page within the browser, and choose «Print to file».
CCS for print
Specific CSS rules allow you to specify how a webpage that was designed for screens, will be displayed in a page layout.
@page
@page rule defines context for printing.
It describes the characteristic of sheet where web page is going to be printed on.
@page property: size
Possible values size: A5, A4, A3, landscape, portrait
Note: Only Chromium's print preview can take the format specified by the CSS
@page {
size: A4 landscape;
}
http://www.w3.org/TR/css3-page/#page-size
- the margins
- orphans,
- widows,
- page breaks of the document.
https://developer.mozilla.org/en/docs/Web/CSS/@page
Important: choose the right page format ().
page-break-before page-break-after page-break-inside orphans widows
@media CSS at-rule
@media <media-query> {
/* media-specific rules */
}
