HTML

 

 

 

1.meta标签

         meta标签的组成：meta标签共有两个属性，它们分别是http-equiv属性和name 属性，不同的属性又有不同的参数值，这些不同的参数值就实现了不同的网页功能。

        1: name属性主要用于描述网页，与之对应的属性值为content，content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。     

<meta name="keywords" content="meta总结,html meta,meta属性,meta跳转">
关键字搜索
<meta name="description" content="老男孩培训机构是由一个老的男孩创建的">
网站描述

        2: http-equiv属性，相当于http的文件头作用，它可以向浏览器传回一些有用的信息，以帮助正确和精确地显示网页内容，与之对应的属性值为content，content中的内容其实就是各个参数的变量值。 

<meta http-equiv="Refresh" content="2;URL=https://www.baidu.com"> 
2秒后跳转到指定的网址
<meta http-equiv="content-Type" charset="UTF-8">
指定编码
<meta http-equiv = "X-UA-Compatible" content = "IE=EmulateIE7"> 
兼容低版本IE

 2.title标签

<title>oldboy</title>
浏览器最上面的标题

 

3.link标签

<link rel="icon" href="http://www.jd.com/favicon.ico">
浏览器标题左边的小图标
<link rel="stylesheet" href="css.css">
引入CSS

 

4.script标签

<script src="hello.js"></script>　
JS的引入以及JS,JQ代码

 

5.块级，内联标签

块级标签：<p><h1><table><ol><ul><form><div>

内联标签：<a><input><img><sub><sup><textarea><span>

　　block（块）元素的特点：

　　　　可以设置长宽

　　　　总是在新行上开始；
　　　　宽度缺省是它的容器的100%，除非设定一个宽度。
　　　　它可以容纳内联元素和其他块元素

　　inline元素的特点：

　　　　不可以设置长宽

　　　　和其他元素都在一行上；
　　　　宽度就是它的文字或图片的宽度，不可改变
　　　　内联元素只能容纳文本或者其他内联元素

注意嵌套规则：

1. 块级元素可以包含内联元素或某些块级元素，但内联元素不能包含块级元素，它只能包含其它内联元素。
2. 有几个特殊的块级元素只能包含内联元素，不能包含块级元素。如h1,h2,h3,h4,h5,h6,p,dt
3. li内可以包含div
4. 块级元素与块级元素并列、内联元素与内联元素并列。

6.h1,h2,h3,h4,h5,h6标签

用来表示标题，1字体最大

7.p标签

段落标签. 包裹的内容被换行.并且也上下内容之间有一行空白.

8.br标签

换行

9.b标签

加粗

10.strong标签

加粗

11.strike标签

为文字加上一条中线.

12.em标签

文字变成斜体

13.sup标签

上角标

14.sub标签

下角标

15.hr标签

水平横线

16.div标签

空标签（块级标签）

17.span标签

空标签（内联标签）

18.特殊字符

https://www.jb51.net/onlineread/htmlchar.htm

19.img标签

src: 要显示图片的路径.

alt: 图片没有加载成功时的提示.

title: 鼠标悬浮时的提示信息.

width: 图片的宽

height:图片的高 (宽高两个属性只用一个会自动等比缩放.)

20.a标签

href:要连接的资源路径 格式如下: href="http://www.baidu.com"

target: _blank : 在新的窗口打开超链接. 框架名称: 在指定框架中打开连接内容.target="_blank"

name: 定义一个页面的书签.

用于跳转 href : #id.（锚）

a标签的妙用：可以向后台发送get请求

21.列表标签

<ul>: 无序列表
         <li>:列表中的每一项.

<ol>: 有序列表
         <li>:列表中的每一项.

<dl>  定义列表
         <dt> 列表标题
         <dd> 列表项    

22.form标签

当提交数据的方式为post的时候

上图提交方式为post，但是可以在action里用request.GET.get来获取nid

 

================================================================================

当form表单提交多个数据的时候在后端需要用getlist来接收数据ids=req.POST.getlist('teacher_ids'),比如下拉框选择多个数据

========================================================================

表单用于向服务器传输数据。

表单能够包含 input 元素，比如文本字段、复选框、单选框、提交按钮等等。

表单还可以包含textarea、select、fieldset和 label 元素。

<form action="服务器路径" method="get/post"

 

①input标签

type:

　　text 文本输入框

　　password 密码输入框

　　radio 单选框

　　checkbox 多选框

　　submit 提交按钮

　　button 按钮(需要配合js使用.) 

　　file 提交文件：form表单需要加上属性enctype="multipart/form-data"

　　　　　　　　　　上传文件注意两点：

　　　　　　　　　　　　1 请求方式必须是post

　　　　　　　　　　　　2 enctype="multipart/form-data"

　　　　　　　　　　服务端接受文件的代码：

def index(request):
    for item in request.FILES:
        fileObj = request.FILES.get(item)
        f = open(fileObj.name, 'wb')
        iter_file = fileObj.chunks()
        for line in iter_file:
            f.write(line)
        f.close()

 

　　reset:清空框里的内容

name:

　　表单提交项的键.注意和id属性的区别：name属性是和服务器通信时使用的名称；而id属性是浏览器端使用的名称，该属性主要是为了方便客
户端编程，而在css和javascript中使用的

value: 

　　表单提交项的值.对于不同的输入类型，value 属性的用法也不同：

　　　　type="button", "reset", "submit", "file" - 定义按钮上的显示的文本
　　　　type="text", "password", "hidden" - 定义输入字段的初始值
　　　　type="checkbox", "radio", "image" - 服务器端显示的值

checked:

　　radio 和 checkbox 默认被选中

readonly:

　　只读. text 和 password

disabled:

　　对所用input都好使（用这个标签会不能使用）

②select标签

name:表单提交项的键.

size：选项个数

multiple：multiple 多选

　　<option> 下拉选中的每一项 属性：

　　　　value:表单提交项的值.

　　　　selected: selected下拉选默认被选中

　　<optgroup>为每一项加上分组

　　　　labei：组名

③textarea标签

name: 表单提交项的键.

cols: 文本域默认有多少列

rows: 文本域默认有多少行

④label标签

<label for="www">姓名</label>
<input id="www" type="text">
点击姓名，会在input输入框里输入

 

23.table标签

<table>
    <thead>
        <tr>
            <th>111</th>
            <th>222</th>
            <th>333</th>
        </tr>
    </thead>
    <tbody>
    <tr>
        <td>111</td>
        <td>222</td>
        <td>333</td>
    </tr>
    <tr>
        <td>111</td>
        <td>222</td>
        <td>333</td>
    </tr>
    </tbody>
</table>

border: 表格边框.

cellpadding: 内边距

cellspacing: 外边距.

width: 像素 百分比.（最好通过css来设置长宽）

<tr>: table row

<th>: table head cell

<td>: table data cell

rowspan: 单元格竖跨多少行（向下独占几行）

colspan: 单元格横跨多少列（向右独占几列）

<thead>: table header <tbody>(不常用): 为表格进行分区.

thead和tbody可以不用写，没什么作用

 24.get请求方式的应用：

 a标签的妙用：可以向后台发送get请求

向后台get请求的时候，地址栏里  /del_classes.html?nid=2   这里?代表隔开/del_classes.html和nid=2，变量nid等于2，可以在后台req.GET.get('nid')，这样就可以拿到nid的值2

 

 

 

转载于:https://www.cnblogs.com/pakhm/p/9166847.html