CSS3是一種用于美化網頁的技術，能夠使網頁更加生動、美觀，其中的打開書效果常常被網頁設計師所采用，非常適合用來呈現文章。

.book{
position: relative;
width: 400px;
height: 270px;
margin: 0 auto;
perspective: 1000px;
transform-style: preserve-3d;
transition: all 1s ease;
cursor: pointer;
}
.book:hover{
transform: rotateY(-180deg);
}
.front, .back{
position: absolute;
width: 100%;
height: 100%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
background: #fff;
box-shadow: 0 0 20px rgba(0,0,0,.5);
}
.back{
transform: rotateY(-180deg);
padding: 20px;
text-align: justify;
font-size: 16px;
line-height: 24px;
overflow: auto;
}

首先，我們需要定義一個book類，用于顯示打開書效果的容器。在該類中，我們設置了容器的寬度、高度、位置和視點距離，以及transition屬性用于使容器有動態效果，在鼠標懸停時能夠顯示打開書的效果。同時，我們還為容器設置了鼠標光標樣式為手型。

接下來，我們定義容器的前面和后面兩個面front和back，其中后面的面會被旋轉，用于展示文章內容。我們設置了每個面的樣式，其中-webkit-backface-visibility和backface-visibility屬性用于防止在旋轉時出現奇怪的黑色區域。

最后，在back面中，我們可以定義文章的具體樣式。在該例子中，我們設置了字體大小為16px，行高為24px，并使用padding屬性設置文字離容器的邊緣距離。對于超出容器大小的內容，我們使用了overflow:auto屬性，這樣可以在需要的時候出現滾動條。

這樣，一個簡單的打開書效果就完成了！你可以按照上述代碼進行參考，自己制作一個非常棒的打開書效果！