打码日常1day--html5+css3（html简介）

最新推荐文章于 2024-01-07 12:06:42 发布

卡角

最新推荐文章于 2024-01-07 12:06:42 发布

阅读量161

点赞数 1

分类专栏： html5+css3 文章标签： html

本文链接：https://blog.csdn.net/qq_42334405/article/details/111715277

版权

html5+css3 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

html5+css3学习笔记

html5

html5

1.网页的基本结构

文档声明(doctype)
文档声明用来告诉浏览器当前网页的版本
html5的结构声明<!doctype html>或<!Doctype HTML>

2.实体

在html中有些时候，我们不能直接写一些特殊符号

比如：多个连续的空格，字母两侧的大于小于符号

  这时需要使用html中的实体（转义字符）
      &nbsp;空格
      &gt;大于号
      &lt;小于号
      &copy;版权符号

查看html实体

3.meta

meta主要设置网页中的一些元数据，元数据不是给用户看
–charset 指定网页的字符集
–name 指定数据的名称
–content 指定的数据内容

      1.页面关键字（表示网站的关键字，可指定多个，用逗号隔开）
      <meta name="keywords" content="your,zhu,haha" />
      2.页面描述（用于指定网站的描述）
      <meta name="description"这是一个不错的网站" />

其他常用meta整理

4.语义化标签

1.块元素和行内元素

块元素（block element），在页面中独占一行
行内元素（inline element），在页面中不会独占一行
一般在块元素里面放行内元素
p元素中不能放任何的块元素

2.标签

在网页html专门用来负责网页的结构

在使用html标签的时候，应该关注标签的语义，而不是样式

  1）标题标签：
          h1~h6 一共六级标签
          一般标签只使用到h1 ~ h3，h4 ~ h6很少用
   2）p标签：
   		表示页面的一个段落
   3）em标签：
   		表示语言强调的一个加重
   4）hgroup标签：
   		用来为标题分组，可以将一组相关的标题同时放在hgroup
   5）blockqute标签：
   		表示一个长引用
   6）q标签
   		表示一个短引用

标签列表（字母排序）
标签列表（功能排序）

3.结构化语义标签

<header>元素描述了文档的头部区域,可有多个
<nav>标签定义导航链接的部分
<section>标签定义文档中的节
<article> 标签定义独立的内容
<aside>标签定义页面主区域内容之外的内容（比如侧边栏）
<figcaption>标签定义 <figure> 元素的标题
<figure>标签规定独立的流内容（图像、图表、照片、代码等）
<footer>元素描述了文档的底部区域，可有多个

详情可查看

div 没有语义，就是用来表示一个区块，目前来讲div是我们的主流布局元素
span 行内元素，没有任何语义，一般用于网页中选中文字

4.列表

在html中也可以创建列表，html列表一共有三种：
   1.有序列表（使用ol标签来创建有序列表，li来表示列表项）
   2.无序列表（使用ul标签来创建有序列表，li来表示列表项）
   3.定义列表（使用dl标签来创建一个定义列表，
  			  dt来表示定义内容，使用dd来对内容进行说明）
   
    列表之间可以相互嵌套

5.超链接（a）

- 使用标签 a 来设置超文本链接
- href 属性描述了链接的目标
- 相对路径都会使用./表示当前文件所在目录../表示文件所在目录的上级目录
- 超链接的其他用法
	target属性，用来指定超链接打开的位置
	    可选值：_self 默认值当前页面打开超链接
			    _blank 在一个新的页面中打开超链接
-在底部可以直接将href属性设为#，点击超链接可以回到顶部
-可以跳转到页面的指定位置，只需要href属性设为#目标元素的id
-可以使用javascript:;来作为href的属性，此时点击这个超链接什么都不会发生

6.图片标签（img）

图片标签用于向当前页面引入一个外部图片
img元素属于替换元素（块和行内元素之间，具有两种元素的特点）
属性：
src 指定图片路径
alt 图片描述，默认不显示，有些浏览器图片无法加载时显示，
搜索引擎会根据alt中的内容来识别图片，不写不会被搜索引擎所搜索

卡角

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
2
评论
打码日常1day--html5+css3（html简介）

html5+css3学习笔记html51.网页的基本结构2.实体3.meta4.语义化标签html51.网页的基本结构-文档声明(doctype)-文档声明用来告诉浏览器当前网页的版本-html5的结构声明<!doctype html>或<!Doctype HTML>2.实体-在html中有些时候，我们不能直接写一些特殊符号-比如：多个连续的空格，字母两侧的大于小于符号这时需要使用html中的实体（转义字符） &nbsp;空格
复制链接

扫一扫