基于HTML+CSS的静态页面设计

@[TOC**]**# 基于HTML+CSS的静态页面设计****

  • 关于个人信息的网站设计

基于HTML+CSS的静态页面设计
工具:WebStorm

正文

一.网站题目

关于个人介绍的网站设计与制作

二.网站描述

HTML+CSS的个人网站设计,采用DIV+CSS布局,里面的css样式主要通过外部链接入HTML文件里面,然后网站页面分主要分为三个部分,导航栏,中间部分和底部:
1.导航栏部分分为了三部分logo部分,跳转链接部分和搜索框部分,在跳转链接部分设置了背景颜色,当鼠标放在跳转链接上时,字体会变大会出现出现背景颜色和边框,当跳转到其他页面时,也会有相应的变化。
2.中间部分在不同的页面会出现不同的样式,出现不同的内容。
3.底部主要写的是关于邮箱,以及个人标识这些。

三.网站介绍

网站由首页,基本信息,证书展示,设置,我的喜欢,我的简历六个界面构成。
1.首页主要是一个主体的介绍,介绍有哪些功能通过header,main,footer这三部分组成。
2.基本信息主要是介绍个人的信息这些,界面主要由盒子模型构成,添加了背景图片。
3.证书展示主要是展示自己平时考的证,界面由标题和轮播图构成。
4.设置界面主要是设置自己的信息,主要由输入框和文字构成。
5.我的喜欢界面是写的关于自己喜欢的东西,主要设置的盒子模型加上css样式等等。
6.我的简历就是关于自己制作的一份简历。

四.网站演示

1.首页
基于HTML+CSS的静态页面设计_第1张图片

2.基本信息

基于HTML+CSS的静态页面设计_第2张图片

3.证书展示
基于HTML+CSS的静态页面设计_第3张图片

4.设置
基于HTML+CSS的静态页面设计_第4张图片

5.我的喜欢
基于HTML+CSS的静态页面设计_第5张图片
详细代码

你可能感兴趣的:(前端,html,css,前端)