MobileRead Forums - View Single Post - font-size headings

Toxaris · 04-10-2014, 01:51 AM

If the titlepage.png is a single page and should fill out the screen (with keeping the aspect ratio of course), putting it in a SVG wrapper is still the best choice.
I use:

Code:

<div>
    <svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 600 800" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
      <image height="800" width="600" xlink:href="../Images/titlepage.png"></image>
    </svg>
  </div>

Notice the preserveAspectRatio difference. This will keep the aspect ratio and not distort the image. Change the red values to the actual dimension of your image.
If you do not use folders in your ePUB, you must omit '../Images/' from the code.

04-10-2014, 01:51 AM	#43
Toxaris Wizard Posts: 4,520 Karma: 121692313 Join Date: Oct 2009 Location: Heemskerk, NL Device: PRS-T1, Kobo Touch, Kobo Aura	If the titlepage.png is a single page and should fill out the screen (with keeping the aspect ratio of course), putting it in a SVG wrapper is still the best choice. I use: Code: <div> <svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 600 800" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink"> <image height="800" width="600" xlink:href="../Images/titlepage.png"></image> </svg> </div> Notice the preserveAspectRatio difference. This will keep the aspect ratio and not distort the image. Change the red values to the actual dimension of your image. If you do not use folders in your ePUB, you must omit '../Images/' from the code.