尚硅谷
TIP
查询网站:www.w3school.com.cn
实体
概述
在html中,有些时候不能直接书写特殊符号
例:多个空格被自动识别为一个空格;字母两侧的大小于号。
如果我们需要在网页中书写特殊符号——使用实体(转义字符)
语法
例: ;空格
>;
<;
<!doctype html>
<html>
<head>
<meta charset='utf-8'>
<title>实体</title>
</head>
<body>
<h1>
今天 <strong>老子</strong> 一点都不卷
</h1>
</body>
</html>
META
meta用于表示网页中无法用
meta有开始标签但必须没结束标签
使用
meta设置的是网页的源数据(给搜索引擎看的)
charset(属于一种源数据)指定网页的字符集
name指定数据名称
content指定数据内容
例如(关键字用逗号隔开)
例如“京东”是“购物”的关键字
关键字为网站在搜索引擎里提供标签
语义标签
html——结构
css——表现
简而言之,html关注的是语义,而非样式
h1-----h6重要性的递减
元素
(块元素block element)——独占一行的元素;对网站的宏观 布局
(行内元素inline element)——在页面中不会独占一行的元素
一般在块元素内放行内元素,不会在行内元素放块元素。
一般的,块元素内可以放别的元素。
p元素不能放块元素。
tip
html会自动给网页中不符合规范的进行修正。(但会改变原有的性能)
例如:标签写在了根元素的外面。
p元素中出现了块元素。
根元素中出现了除了head和body以外的子元素…
标签例
hgroup标签: 给标题分组,可以将一组相关标题同时放入hgroupe中
em标签(行内元素):语音语调的加重
strong标签(行内元素):(字体加粗效果)表示强调重要的内容
blockquote标签(块元素):块引用(缩进效果)
br标签:换行标签
H5新增标签
header标签:网页头部(最顶上)(不唯一)
footer标签:网页底部(不唯一)
main标签:网页的主体部分(唯一性)
nav标签:网页中的导航(一排菜单)
举例:
<nav class="crumbs">
<ol>
<li class="crumb"><a href="bikes">Bikes</a></li>
<li class="crumb"><a href="bikes/bmx">BMX</a></li>
<li class="crumb">Jump Bike 3000</li>
</ol>
</nav>
aside标签:和主体相关但又不属于主体的其他内容(侧边栏)
article标签:一个独立的文章
section标签:表示一个独立的区块(其他)——上面的标签都不能表现时,用此表示
div标签:没有语义 仅表示一个区块
span标签(行内元素):没有语义,一般用于网页内选中文字
列表
1、有序列表
ol标签创建列表,li创建列表的项
例如
<ol>
<li>卷</li>
<li>玩耍</li>
<li>网抑云</li>
</ol>
2、无序列表
ul标签创建列表,li创建列表的项
创建同上
3、定义列表
dl标签创建列表
dt制定定义内容
dd描述
例
<ol>
<li>卷</li>
<li>玩耍</li>
<li>网抑云</li>
</ol>
<dl>
<dt>卷</dt>
<dd>学习</dd>
</dl>
列表之间可以相互嵌套
<ol>
<li>
卷<ol>
<li>学C艹</li>
</ol>
</li>
<li>玩耍</li>
<li>网抑云</li>
</ol>