学习Python的一天

哈喽，大家好，今天又是学习Python的一天。上一章说到了多个页面的跳转，这一章就要看看怎么构造这几个页面。

第一个是，book.html页面，我们就只是显示书籍的图片和介绍。，我们先用个p包括所有书籍，每个图片和介绍用li结构，所以最后写的结构是这样的，

当然我们还要写css页面，但是现在我们先构造页面结构先。

第二个是，sort.html页面，我们就每个书籍种类暂定为10种，我们先用nav导航栏分类为10种，每一种分类用四级标题，而每一个四级标题下都要个p包括和来展示书籍信息，展示信息还是页面图片和介绍，最后就是这样的。

第三个是,history.html页面，我们先用个p来包括阅读过的信息，我们要展示的信息就是图片，书名，作者和阅读多少章节。最后就是这样。

而我们要第一个book.html页面好看，就开始编写css，看下列图片

body,li,p结构就不说了，都是前几章的知识点，我们让li有了宽度和高度，并且是向左浮动，而且每个li结构都有向右的外边距为20px。我们的图片，也是img是行内块元素，不是独占一行的，我们要让图片在li结构独占一行，就用到display:block;同时规范一下图片的大小，span结构都是文字，所以我们规范一下文字的大小，就用font-size:15px;因为文字介绍太长，我们就设置文字超过li的高度就隐藏并且用...表示，overflow:hidden;就是隐藏超出文本，text-overflow:ellipsis;就是超出文本用...表示。因为文字有是会有一半在显示，所以我们规范一下，显示六行文字，就是-webkit-line-clamp:6;因为这个元素要和display:-webkit-box;

-webkit-box-orient:vertical;和起来才有用，但是它不兼容ie和火狐。最后的效果是这样的。