html5,css css3 bootatarp4 ,这些前端基本知识
今天从html5开始大概梳理一下;
html:是一种创建网页语言的标准标记语言。
文件结构;
<!DOCTYPE html>
<html>
<head>...</head>
<body>...</body>
</html>
<!DOCTYPE html>:声明,这是html什么版本写的。
<html>:是根标签。
head:定义文章头部!包含:style,meta,link,title,script·····
body:网页的主要内容。包含:h1—h6,p,a,span,img,i等标签。
综合使用;
<!DOCTYPE html>
<html>
<head>
<title>这是头部</title>
</head>
<body>
<h1>这是h标签</h1>
<p>这是一个p标签</p>
<img src="xxx(引用图片)">
<a href="#">这是一个a标签,链接</a>
</body>
</html>
语义化:明白每个标签的用处,比如 只是一个标题 就用h标签,需要插入图片用img...
认识body标签;
<p>段落文本</p> 有几段就放几个p
<h1>标题标签</h1> h1—h6共6个标题分级
<em>斜体</em> 斜体文本(强调斜体文本) <i>斜体</i>(仅仅表示斜体)
<strong>粗体</strong>粗体文本(加重语气) <b>粗体</b>(只表示这是一个加粗的文本)
<sub>定义下标字</sub> 定义下标文本 比如 :100元 “其中的“元”就好比在html中加了字体下标”
<sup>定义上标字</sup>定义上标文本 和<sub>用法一样 只不过是作用于上方 好比数字中的平方。
<span>单独样式文本</span> 没有语义的 一般作用于某个样式的其中一处 给它单独设置样式。
<br/> 换行符
<hr/>水平横线
<a href="#" title="xx" target=“_blank”>链接</a> 这是一个链接 ,其中“#”为网站地址、文本、图片、图标都可以的’,"title=xx"鼠标经过时显示的文本。“target=_blank”会在点击这个链接时打开一个新的网页来显示。
例子;
<!DOCTYPE html>
<html>
<head>
<title>链接</title>
</head>
<body>
<a href="https://www.baidu.com/" title="百度" target="_blank">百度</a>
</body>
</html>
img标签;
<img src="图片地址" alt='图片加载失败替换文字' title="提示文本">
三个列表 :ul(无序列表) ol(有序列表) dl(自定义列表)
<ul> <ol> <dl>
<li>内容以圆点显示</li> <li>以123排列</li> <dt></dt>
</ul> </ol> <dd>....</dd>
</dl>
div:块级元素,定义文档中的分区。
<div class="" id=''>
<h1></h1>
<p></p>
.....
</div>
class/id 定义div样式
div中可以加很多样式:h1,p,img,a,......