Ik probeer de coverfoto van een epub ( = xhtml-bestan )te vervagen met behulp van css

Status
Niet open voor verdere reacties.

janyep

Gebruiker
Lid geworden
7 mei 2008
Berichten
261
De omslag-foto's van de .epub-bestenden in de SONY-reader vind ik in zwart/wit vaak onduidelijk
en had gedacht dat dit in de titlepage.xhtml wellicht kon worden aangepast.

Ik heb toegevoegd de @media-querie
but ... nothing happens.

" @media handheld " doet ook niets.
" @media { svg " verandert in " @media { image " verandert ook niets

Code:
<style type="text/css">
@page {padding: 0pt; margin:0pt}
body { text-align: center; padding:0pt; margin: 0pt; }
 
@media {
svg {opacity:0.96;
-moz-opacity: 0.96;
-khtml-opacity: 0.96;
opacity: 0.96;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=96);
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=96);

filter:alpha(opacity=96);
}
}
</style>

Heeft iemand een suggestie?

Vriendelijk dank, gr. janyep

Code:
<?xml version="1.0" encoding="utf-8" standalone="no"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta content="true" name="calibre:cover" />
<title>Cover</title>
 
<style type="text/css">
@page {padding: 0pt; margin:0pt}
body { text-align: center; padding:0pt; margin: 0pt; }
 
@media {
svg {opacity:0.96;
-moz-opacity: 0.96;
-khtml-opacity: 0.96;
opacity: 0.96;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=96);
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=96);
filter:alpha(opacity=96);
}
}
</style>
</head>
 
<body>
<div>
<svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 250 377" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
<image height="377" width="250" xlink:href="../Images/cover1.jpeg"></image>
</svg>
</div>
</body>
</html>
 
Ja tjonge jonge,
moet ik hier nu echt alles zelf doen? :) :)

Nou vooruit dan:

titplepage.xhtml :

Code:
<?xml version="1.0" encoding="utf-8" standalone="no"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
  <meta content="true" name="calibre:cover" />

  <title>Cover</title>
  
<style type="text/css">
@page {padding: 0pt; margin:0pt}
            body { text-align: center; padding:0pt; margin: 0pt; }
</style>
</head>

<body>
  <div>
    <svg xmlns="http://www.w3.org/2000/svg" height="100%" [B][COLOR="#FF0000"]opacity=".5"[/COLOR][/B] preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 250 392" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
      <image height="392" width="250" xlink:href="../Images/cover1.jpeg"></image>
    </svg>
  </div>
</body>
</html>
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan