web页面布局基础
目录
1.网页三剑客(缺一不可)
2.html常用的标签
2.1.html定义---超文本标记标签语言
2.2.html的创建和基本结构
2.3标签结构
单标签
双标签
2.4常用的标签
常用的双标签
【1】页面结构常用标签
【2】页面布局常用标签
1.网页三剑客(缺一不可)
html---网页结构布局---就是毛坯房
css----对页面布局进行效果美化---装修
javascript---动态效果,数据的交互
2.html常用的标签
2.1.html定义---超文本标记标签语言
【超文本】---文件中可以存放文本字符,音频视频,动效,超链接等
【标记标签】---<开始标签名称>文本内容<结束标签名称/>
2.2.html的创建和基本结构
html---根标签(把head标签和body标签包裹)
head---头部标签(用来写css样式,link其他文件,或者做页面客户端适配)
body---主体标签(用来写页面标签,页面设计,js交互等)
示例:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>页面名称</title>
</head>
<body></body>
</html>
2.3标签结构
单标签
单个标签就能表示一个完整的结构
例如:
<img>;<link>等
双标签
需要两个标签才能表示一个完整的结构
例如:
<div></div>表示一个盒模型;<h1></h1>表示一个完整的标题
2.4常用的标签
单标签
meta---设置元信息:字符格式编码,关键字,窗口
link---关联外面文件:css文件,页签的图标
常用的双标签
【1】页面结构常用标签
html---根标签
head---头部标签
body---主体标签
title---标题标签
【2】页面布局常用标签
h ---标题
p ---段落
img---图片
a ---超链接
audio---音频
video--视频
ul/ol ---列表
table ---表格
form ---表单
至于详情怎么使用可以参考以下链接HTML 教程 | 菜鸟教程