User:Megan Hoogenboom/project2

Descrition

For this thematic project we had an oportunity to work with ebook-readers. A challanging and exciting change, wich I used to transform a poem by Paul van Ostaijen to ebook format. I looked at the function of a poem on a page and the functions and disfunctions of an Ebook reader.

Links to Project

Projects

• Annotated Bibliography
• Project proposal
• Essay

End Result

• Paul van Ostaijen on an Ebook reader

Source Code

The css code of the epub file:

 @font-face {
  font-family: "rollout";
  font-style: normal;
  font-weight: normal;
  src:url(res:///Data/FONT/benweiner_-_Rollout_Bold.otf);
}
 @font-face {
  font-family: "libertinage";
  font-style: normal;
  font-weight: normal;
  src:url(res:///Data/FONT/Libertinage-l.ttf);
}

body { margin: 0 auto; padding: 0.75em 5%; background-color: #FFFFFF; color: #000000 } 

h1 { text-align: left; font-size: 100pt; font-family: rollout, sans-serif; font-weight: bold; margin-left: -30px; margin-top: -40px;} 

h2 { text-align: left; font-size: 40pt; font-family: rollout, sans-serif; font-weight: bold; margin-top: -230px; margin-left: 50px;}  

h3 {  } 

#black { background-color: #000000; }
#whitetext { color: #FFFFFF; }

#plat { font-family: rollout, sans-serif; font-weight: bold; color: #FFFFFF; text-align: right; margin-right: 50px; margin-top: -56px; }
#dar { font-family: libertinage, serif; color: #FFFFFF; text-align: left; margin-top: -50px; }
#ooo { font-family: rollout, sans-serif; color: #000000; margin-left: 75px; margin-top: 450px; font-size: 120%}

#weer { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 100%; margin-left: 0px; margin-top: 0px; }
#violen { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 150%; margin-left: 0px; margin-top: 0px; }
#bassen { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 200%; margin-left: 180px; margin-top: -78px; }
#koperen { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 250%; margin-left: 0px; margin-top: -15px; }
#triangel { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 275%; margin-left: 235px; margin-top: -119px; }
#trommels { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 300%; margin-left: 0px; margin-top: -3px; }
#pauken { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 400%; margin-left: 0px; margin-top: 0px; }

#razen1 { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 100%; margin-left: 0px; margin-top: 0px; }
#rennen1 { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 150%; margin-left: 0px; margin-top: 0px; }
#razen2 { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 250%; margin-left: 0px; margin-top: 0px; font-style: }
#rennen2 { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 300%; margin-left: 0px; margin-top: 0px; }
#razen3 { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 400%; margin-left: 0px; margin-top: 0px; font-style: }
#rennen3 { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 400%; margin-left: 0px; margin-top: -20px; } 

#drama { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 150%; margin-top: -5px; }
#eer { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 220%; margin-top: -10px; }  

#fabriek2 { font-family: libertinage, serif; color: #FFFFFF; text-align: left; font-size: 175%; margin-top: 250px; }
#eer2 { font-family: libertinage, serif; color: #FFFFFF; text-align: left; font-size: 200%; margin-top: -50px; }    
#vallen { font-family: libertinage, serif; color: #000000; text-align: left; font-size: 260%; margin-top: 250px; }
  
#halt { font-family: rollout, sans-serif; color: #FFFFFF; text-align: left; font-size: 175%; margin-left: 180px; margin-top: 200px; }