Html/CSS最终章（L）网页制作和布局

最新推荐文章于 2024-04-17 16:01:10 发布

InterspaceITX

最新推荐文章于 2024-04-17 16:01:10 发布

阅读量400

点赞数 2

分类专栏： Html/CSS/Js网页文章标签： css css3 前端 html javascript

本文链接：https://blog.csdn.net/InterspaceITX/article/details/124814100

版权

网页布局

网页布局有很多种方式，一般分为以下几个部分：头部区域、菜单导航区域、内容区域、底部区域。

头部区域

头部区域位于整个网页的顶部，一般用于设置网页的标题或者网页的 logo

菜单导航区域

菜单导航条包含了一些链接，可以引导用户浏览其他页面

内容区域

内容区域一般有三种形式:

1 列：一般用于移动端
2 列：一般用于平板设备
3 列：一般用于 PC 桌面设备

底部区域

底部区域在网页的最下方，一般包含版权信息和联系方式等

响应式网页布局

通过以上等学习我们来创建一个响应式等页面，页面的布局会根据屏幕的大小来调整

--Html/CSS的应用学习成品代码--

以下代码为ITX的个人网页，内容自己更改哦o(*￣▽￣*)o

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Interstellar-X</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
<style>
* {
  box-sizing: border-box;
}
 
body {
  font-family: Arial;
  padding: 10px;
  background: #f1f1f1;
}

h1
{
	text-shadow: 10px 10px 10px rgb(0,0,0);
}

/* 头部标题 */
.header {
  padding: 30px;
  text-align: center;
  background-color: red; /* 浏览器不支持时显示 */
  background-image

最低0.47元/天解锁文章

InterspaceITX

关注

2
点赞
踩
7

收藏

觉得还不错? 一键收藏
0
评论
Html/CSS最终章（L）网页制作和布局

网页布局网页布局有很多种方式，一般分为以下几个部分：头部区域、菜单导航区域、内容区域、底部区域。头部区域头部区域位于整个网页的顶部，一般用于设置网页的标题或者网页的 logo菜单导航区域菜单导航条包含了一些链接，可以引导用户浏览其他页面内容区域内容区域一般有三种形式:1 列：一般用于移动端 2 列：一般用于平板设备 3 列：一般用于 PC 桌面设备底部区域底部区域在网页的最下方，一般包含版权信息和联系方式等响应式网页布局通过以上等学习我们来创建一个响应式
复制链接

扫一扫