应用软件:
b/s,c/s ——网页为b/s架构
html——结构
css——表现
js(编程语言)——行为
jquery库,bootstrap——框架
网页的基础认识:
·网站:因特网上根据一定的规则,用html等制作的用于展示待定内容相关的网页
·网页:构成网站的基本元素
·网页的内容:文字,图片,音频,视频,超链接 (能看见的),代码,结构,表现,行为,框架(不能看见的)
HTML是什么?
·超文本标记语言:描述网页的语言
·超——不仅有文字,还有图片,音频,视频等(可以从一个网页跳转到另一个网页(超级链接文本))
·标记:文本要成为超文本,就需要各种标记符号
·语言:每一个标记的写法,读音,使用规则,构成标记语言
<开始标签>标签体</结束标签>
标签可以嵌套
html的骨架(shift+i(英文状态下)——快速创建html结构)
<!DOCTYPE html> ——声明文档 html5
<html lang="en"> ——语言,此时为英语
<head>
<meta charset="UTF-8"> ——万国码,包含世界上所有的
<title>Document</title>
</head>
<body>
</body>
</html>
常见的标签:
<marquee loop="1"> 标签体</marquee>——左右滚动标签
<标签 属性名="属性值"> ——属性名与属性值相同,只写属性名
loop ——1代表循环一次,-1代表无限循环
<!-- --> ——注释对代码标记(ctrl+/)
<h1></h1>——标题1-6字体大小不断变小
<p></p>——分段
<br>——换行
<hr>——水平线
<strong></strong>
<b></b>——加粗
<em></em>
<i></i>——斜体
<del></del>
<s></s>——删除
<ins></ins>
<u></u>——下划线
<div></div>——无语义标签,可以存放其他标签(容器),独占一行
<span></span>——同div但是是小容器,不独占一行
图片标签:
<img src="./...路径" alt=" " title=" " width=". .px" hight=" ..px" border=" "></img>
——src指向图片位置,alt当图片地址错误时,用来提示的字,title鼠标经过时显示的文字,width设置宽,hight设置高,px是像素,borser边框
视频标签:
<video src="./..路径" controls autoplay muted loop poster="...."></video>
——谷歌浏览器默认不播放,需要添加后缀controls,自动播放autoplay,静音播放muted,loop循环播放,auto play和muted需要合并使用,poster加载等待的画面
音频标签
<audio src=".." controls ></audio>
——必须加后缀controls才可以打开
超链接标签
<a href="路径" target="_blank"></a>
——默认当前窗口打开_self,target为打开方式,_blank为新开窗口,href跳转的位置
锚链接div id属性
<a href="#名称"> </a>——即可跳转
<div id=" 名称">标题</div>
——相当于身份证号
有序列表标签
<ol type="a">
<li> </li>
</ol>
——type a 代表字母序号
无序列表
<ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
</ul>
——type
用于设置列表的着重号样circle
<ul type="circle">
<li></li>
</ul>
自定义列表
<dl>
<dt>标题</dt>
<dd>列表内容</dd>
<dl>
iframe框架——嵌套
<iframe src="需要嵌套的网址" width="..px" height="..px">
链接和嵌套的共同使用
<a href="所要嵌套的网址" target="name">标签体</a>
<iframe name="name" frameborder="0" width="800px" height="200px"></iframe>
特殊字符