HTML5CSS3网页设计与制作（第二版）课件：CSS美化网页案例.pptxVIP

CSS美化网页案例

1制作百度热搜目录CONTENTS

01制作百度热搜通过前面内容的学习，掌握了CSS美化页面的设计，本节通过CSS知识完成百度热搜案例制作，加深CSS美化网页设计的实际应用。通过CSS完成该案例，首先要对页面进行分析。根据效果图，分析页面，该页面由哪几部分组成，用到了哪些元素，每个元素的样式有什么区别，对页面了解清楚后，接下来完成该案例就比较容易。

01制作百度热搜1．完成简易的页面内容首先完成页面的元素布局和文字内容等，通过分析，页面由四部分组成：①最上方logo图片，可采用div标签和img标签完成；②第二行搜索框和“百度一下”按钮，可采用div标签和input标签；③第三行“百度热搜”与“换一换”可采用div标签、span标签和a标签完成；④热搜列表内容部分采用无序列表ul标签、li标签、span标签完成。

01制作百度热搜2．页面的美化整个页面需要分步骤进行CSS代码编写，美化图片、搜索框、按钮、搜索列表等栏目。

感谢您的聆听