ps:之前看django学习一脸懵逼,因为自己连最基础的html都没有学习,所以也不太可能学习好web,现在要学习好html的编写规则 ,看得懂而且懂得如何做才好。
1.html
首先明确上网的本质就是进行上传和下载。在进入某个网页的时候,是网站的服务器将其的html文件给浏览器,经过浏览器渲染之后呈献给使用的人。想要让浏览器读懂html,需要按照其规则进行编写,实质上html文件也是一种语言,浏览器就是html文件的解释器。
2.html内容
2.1表头
2.1.1<DOCTYPE html>
此为历史遗留问题,为了兼容早年的各种标准,对新模式进行生命,如不声明,则默认使用旧模式进行渲染。
2.1.2 lang=en
表明渲染是以中文为语言
2.1.3 meta charst='utf-8'
在进行编码时,以utf8进行编码
2.2 根标签
2.2.1 head标签
2.2.1.1 meta
meta标签具有http-equiv和name属性
2.2.1.1.1 name
- name=keywords
关键词属性,通过搜索引擎进行搜索时,以这个为关键字,用户搜索关键字中如果有这显示
<meta name="keywords" content="it">
- name=description
用户进行搜索时显示网页的描述信息,相当于进行简介
<meta name="description" content="it">
2.2.1.1.2 http-equiv
- http-equiv='Rfresh'
默认进行刷新,两秒钟之后刷新页面并且转到某一网页
<meta http-equiv="Refresh" content="2,www.baidu.com">
- http-equiv='content-type'
定义网页的编码
<meta http-equiv="content-type" charset="GBK">
2.2.1.2 非meta标签
2.2.1.2.1 网页图标
<link rel="icon" href="www.baidu.com.123.jpg">
2.2.2 body标签
body标签是html的正文,是真正显示在浏览器上的内容
2.2.2.1 <h1>调整字体大小
还有h2,h3,h4等,对应不同的大小
<h1>hello</h1>#字体较大,在浏览器直接显示hello。
2.2.2.2 <p>
p内将输入的内容独立一行显示出来,无特别意义
<p>hello</p>
2.2.2.3<b>
给标签加粗,效果和<strong>相同
<b>hello</b> <p>hello</p>
2.2.2.4<strike>
给标签内容中间加上横线
<strike>hello</strike>
2.2.2.5<em>
标签内容斜体
<em>hello</em>
2.2.2.6 <sub>
给标签作为下标角标使用,sup为上角标
<sub>22222</sub> <sup>22222</sup>
2.2.2.7hr
<hr>
使用直接直接在浏览器上画一个和浏览器宽度一致的横线
2.2.2.8 <div>
div没有特别的特点,但是会很常见的使用,因为可以根据自己的需求给它加上特别的功能,
如果是使用h1这种加功能的话,本身h1已经带上了特殊字体,所以使用不带特殊功能的div比较方便
2.2.3 块级标签和内联标签
块级标签:独占一行并且可以嵌套内联标签和块级标签
内联标签:不独占一行,如果需要换行需要加<br>
2.2.4给html加空格
在html中,无论手动输入多少个空格,都默认只显示一个
所以:
 ==>一个空格
<==>小于号
>==>大于号
©==>c符号
&Reg==>r商标符号
3. img标签
img即图片,给html中加入图片
src:图片文件的上传路径。
alt:图片没有加载成功是显示的内容
<img src="C:\Users\brown\PycharmProjects\python_s3\day37\1.png" alt="">
4.<a>标签
a标签是超链接标签,点击之后可以跳转到另外一个网页,target是点击时新创建一个窗口,如果不写则在当前窗口上进行跳转
<a href="www.baidu.com" target='_blank'></a>
5.列表标签
5.1<ul>
无序标签,通过li来包装
<ul> <li> 111 </li> <li>222</li> <li>22233</li> </ul>
- 111
- 222
- 22233
5.2 有序列表<ol>
显示顺序123
<ol> <li>11</li> <li>22</li> <li>33</li> </ol>
- 11
- 22
- 33
5.3 dl结构标签
<dl> <dt>22 <dd>11</dd> <dd>33</dd> </dt> </dl>
22
11
33
相当于分级结构,第一章,第一节
6.form表单
6.1给标签加上id
标签的id是在整个html中唯一的
<div id="ll"></div>