学习HTML主要学习标签。
ctrl+c复制 ctrl+v粘贴 ctrl+s保存 ctrl+a全选
windows+d返回主界面 windows+e打开计算机
前端包括PC端和移动端
网页的组成:文字,图片,按钮,输入框,视频。。
web标准:制作网页的规范 web(World Wide Web)即全球广域网,也称为万维网
web标准:
1.结构标准 html
2.表现标准 css 美化网页
3.行为标准 js 网页对用户操作的属性
浏览器与服务器之间的关系
windows自带iis服务器软件
HTML Hyper Text Markup Language超文本标记语言
超文本:在网页中能够实现页面跳转的文本【超链接标签】
标记:在网页中显示的标签【在网页中做记号】
结构:
<!DOCTYPE html> 【指定文档类型为html类型,如果没有浏览器将按照自得的方式渲染,我们成为怪异类型】
<html> 【跟标签】
<head>
<title>网页标题</title>
</head>
<body>
在浏览器中看到的所有网页信息
</body>
</html>
结构中标签的分类:
单标签:标签只有开始没有结束 如<link>,<hr>
双标签:标签又开始有结束 如<head></head> <body></body>
ctrl+shift+d复制粘贴一行信息
单击要修改的地方的后面 按住ctrl再点击其他地方,删除修改 就会修改成相同内容
标签关系分类:
嵌套关系(父子关系 后代关系)
并列关系(兄弟关系)
文件后缀名决定打开方式
单标签(标记)
注释标签<!--注释标签--> ctrl+/
换行标签<br> 横线标签<hr>
h1-h6
双标签(标记)
h1-h6标签
美国拉斯维加斯附近发生地震
美国拉斯维加斯附近发生地震
美国拉斯维加斯附近发生地震
美国拉斯维加斯附近发生地震
美国拉斯维加斯附近发生地震
美国拉斯维加斯附近发生地震
从语义化角度考虑一个网页中一号标题最好出现一次
段落标签
<p></p>
表示强调标签
<font></font>文本标签 规定文本的尺寸、字体和颜色
color:改变文字颜色属性
size:改变文字大小属性
<strong></strong>或者<b></b>文本加粗显示
<em></em>或者<i></i>文字斜体显示
<ins></ins>或者<u></u>下划线标签
<del></del>或者<s></s>删除线
没有语义的标签
<div></div>实现网页布局
<span></span>在网页布局过程中使用 div标签需要独占一行,div标签可以包含任何标签
多媒体标签
图片标签<img>
属性:src:设置一个要显示的图片路径
title:设置鼠标悬停到图片上的文字提示
alt: 对图片的描述信息,为搜索引擎提供服务
width:高度 height:高度 如果只设置一个属性会自动调整
路径
绝对路径 1带有磁盘的路径 2带有具体网址
相对路径
1.如果资源文件(img)和当前文件(html)在同一个文件夹中,src="图片名称"
2.如果页面在图片的上一级目录中,src="图片所在文件名 / 图片名称"
3.如果页面在图片的下一级目录中,src="../ 图片名称"
注意:一个../代表返回一级
超链接
<a href=""></a> 跳转页面
href="#"不跳转任何界面
属性: title:设置鼠标悬停到超链接上的文字提示
target:self 默认值在当前页面中打开新页面
_blank 在新窗口中打开页面
<base> 页面上的所有连接修改打开方式,如<base target="_blank"> 在head标签里面添加
锚链接 :属于超链接的另一种用法 。实现的是本页面内部的跳转
如:<div id="某值"></div>
<a href="#x某值"></a>
HTML版本介绍
过渡版本Transitional 可以包含所有的html元素和属性
严格版strict 可以包含所有html元素或者属性,但是不包含已经被废弃的标签,如font,b,i和属性align
html5标签
<!--导航标签-->
<nav></nav>
<!-- 区域 -->
<section></section> 有语义的标签
<!-- 底部 -->
<footer></footer> 注意:以上标签与div的用法一样,只是具有一定的语义
<!-- 侧边栏 -->
<aside></aside>
<!-- 文章 -->
<article></article>
视频标签
video
<video src="movie.mp4" controls autoplay loop> </video>
controls显示控制面板 autoplay自动播放 loop循环,不能指定循环次数
多种视频格式,只要有一个格式正确就可以打开
<video controls>
<source src="movie.mp4">
<source src="movie.mp3">
<source src="movie.rmvb">
</video>
音频
audio
<audio src="music.mp3" controls autoplay loop>