How to create a drawing in open book format with content inside?

Open the image in Photoshop by selecting the area of the text, with the selection tool, click with the drops account in the white area of the paper where the text is, with the selected color dye it white with the command alt + delete, then with the slice tool, cut this image into three parts, as in the example below:

Nowcreatetheboxandcssasbelow:

<style>#livro{width:868px;min-height:550px;background:#fff4d6;}#livro.content{width:868px;height:auto;background:url(imagens/content.jpg)centercenterrepeat-y;}#livro.contentp{color:#00777f;font-family:Arial,Verdana;font-size:14px;padding:20px10px;}#livro.top{width:868px;height:49px;background:url(imagens/top.jpg)centertopno-repeat;display:block;}#livro.bottom{width:868px;height:75px;background:url(imagens/bottom.jpg)centertopno-repeat;display:block;}</style><divid="livro">
  <div class="top"></div>
   <div class="content"> <p>
Lorem ipsum dolor sit amet, possim 
ullamcorper pro ea, error possim 
deterruisset vim te. In quo suas signiferumque, no sea debitis facilisi. Id doming ponderum interpretaris vim, 
ius an elitr adipiscing dissentias. Eu est agam concludaturque. Ut mea omnis clita scriptorem, nihil accumsan 
moderatius in mel. Te has offendit detraxit maiestatis, vel ut vide insolens accusamus. </p>
 <p>
Quo ei equidem nostrum, ad vis case assentior 
definitionem. Pro quod appareat ut, ei pro malis percipit instructior, vis ne nostrum posidonium. Ad vis harum latine, 
pro nullam rationibus ut, veri noluisse 
dissentias eum at. Pri in numquam dolores, at pro vocent praesent posidonium.
 </p>
 <p>
Ad duo libris platonem, mea ex accusam 
consequuntur. Aperiam evertitur duo at. Hendrerit mnesarchum ex his. Vix congue veniam at, ad veri postea incorrupte vix. Mei ex qualisque percipitur cotidieque.
 </p>
 <p>
Ex facilis accusam usu, ponderum 
intellegat an sit. Te pri persius 
efficiendi concludaturque. Liber 
salutatus adversarium ea vis. His ea quot ridens perfecto. Eum id vidit quando.
 </p>
 <p>
In sea iusto honestatis. Clita sensibus 
cum no, percipit recteque scriptorem vis 
cu. Erant graeci ne vel, omnis aperiam 
ne mei. At his eirmod cetero. </p>
</div>
  <div class="bottom"></div>
</div>

Note: If you want to use only CSS, use SVG, canvas or convert the images to base64, here is a website that does it for you: link

Make a div with the css background-image: then set the padding so that the text does not exceed the border of the page, if the "border" of the book is about 10 pixels, use some 20 padding. Then place the desired div content. Do not forget to leave the image size equal to the div

Ex:

<div style="background-image:url('livro.gif');padding-left:20px;padding-right:20px">Aqui vai o texto do livro</div>