The following editor will bring you a summary of front-end HTML knowledge points (recommended). The editor thinks it is quite good, so I will share it with you now and give it as a reference for everyone. Let’s follow the editor to take a look
1. Overview of html
htyper text markup language Hypertext Markup Language
Hypertext: It means that the page can contain pictures, links, and even non-text elements such as music and programs.
Markup language: A language composed of tags (tags).
Web page == HTML document, parsed by the browser, used to display
Static web page: static resources , such as xxx.html
Dynamic web page: The html code is dynamically generated by a certain development language based on user requests
The following is a tree structure diagram of the html file
The concept of tags:
•It is composed of a pair of words wrapped in angle brackets. For example:*All tags The words in cannot begin with a number.
•Tag is not case-sensitive.and. Lowercase is recommended.
•Tag is divided into two parts: start tagand end tag. The part between the two tags is called the tag body.
•Some tag functions are relatively simple. Just use one tag. This kind of tag is called self Closure and tag. For example:
•Tags can be nested. But they cannot be cross-nested. < a>
Attributes of the tag:
•Usually appear in the form of key-value pairs. For example name="alex"
•Attributes can only appear in opening tags or closing tags.
•Attribute names are all lowercase. *Attribute values must be wrapped in double quotes or single quotes. For example name="alex"
•If the attribute value is exactly the same as the attribute name, just write the attribute name directly. For example, readonly
2. Introduction to the main head tag
•
The composition of the meta tag: the meta tag has two attributes, they are the http-equiv attribute and the name attribute. Different attributes have different parameter values. These are different The parameter values realize different web page functions.
1 The name attribute is mainly used to describe web pages, and the corresponding attribute value is content. The content in content is mainly used by search engine robots to find information and classify information.
2 http-equiv, as the name suggests, is equivalent to the file header function of http. It can return some useful information to the browser. Information to help display web page content correctly and accurately. The corresponding attribute value is content. The content in content is actually the variable value of each parameter.
//(Note the quotation marks at the end, which are in front of the seconds. and the end of the URL)
•
•
3. Body tag
Basic tags:
: Paragraph tag. The wrapped content is wrapped and there is a blank line between the upper and lower content.
: bold tag.
: for Add a center line to the text.
: The text becomes italic.
and: Superscript and subscript.
:Line break.
Block-level tags and inline tags
Block-level tags:
Inline tags:< ;input>
##Characteristics of block elements
① Always starts on a new line;② Height, line height, margins and padding can all be controlled;③ The default width is that of its container 100% unless a width is set.④ 它可以容纳内联元素和其他块元素
inline元素的特点
① 和其他元素都在一行上;
② 高,行高及外边距和内边距不可改变;
③ 宽度就是它的文字或图片的宽度,不可改变
④ 内联元素只能容纳文本或者其他内联元素
对行内元素,需要注意如下
设置宽度width 无效。
设置高度height 无效,可以通过line-height来设置。
设置margin 只有左右margin有效,上下无效。
设置padding 只有左右padding有效,上下则无效。注意元素范围是增大了,但是对元素周围的内容是没影响的。
特殊字符:
< >;";©®
图形标签:
src: 要显示图片的路径.
alt: 图片没有加载成功时的提示.
title: 鼠标悬浮时的提示信息.
width: 图片的宽
height:图片的高 (宽高两个属性只用一个会自动等比缩放.)
href:要连接的资源路径 格式如下: href="http://www.jb51.net"
target: _blank : 在新的窗口打开超链接. 框架名称: 在指定框架中打开连接内容.
border: 表格边框.
cellpadding: 内边距
cellspacing: 外边距.
width: 像素 百分比.(最好通过css来设置长宽)
: table row(不常用): 为表格进行分区表单标签
表单用于向服务器传输数据。
表单能够包含 input 元素,比如文本字段、复选框、单选框、提交按钮等等。
表单还可以包含textarea、select、fieldset和 label 元素。
1、表单的属性
HTML 表单用于接收不同类型的用户输入,用户提交表单时向服务器传输数据,从而实现用户与Web服务器的交互。表单标签, 要提交的所有内容都应该在该标签中.
action: 表单提交到哪. 一般指向服务器端一个程序,程序接收到表单提交过来的数据(即表单元素值)作相应处理,比如//m.sbmmt.com/
method: 表单的提交方式 post/get 默认取值 就是 get(信封)
get: 1.提交的键值对.放在地址栏中url后面. 2.安全性相对较差. 3.对提交内容的长度有限制.
post:1.提交的键值对 不在地址栏. 2.安全性相对较高. 3.对提交内容的长度理论上无限制.
get/post是常见的两种请求方式.
2.表单元素
type:
text 文本输入框
password 密码输入框
radio 单选框
checkbox 多选框
submit 提交按钮
button 按钮(需要配合js使用.) button和submit的区别?
file 提交文件:form表单需要加上属性enctype="multipart/form-data"
XML/HTML Code复制内容到剪贴板
def index(request):
print request.POST
print request.GET
print request.FILES
for item in request.FILES:
fileObj=request.FILES.get(item)
# =fileObj.chunks()
## for line in iter_file:## f.write(line)f.close()
## Used in #css and javascript.
type="button", "reset", "submit" - defined on the button The displayed text
type="checkbox", "radio", "image" - Define the value associated with the input
readonly: read-only. text and password
disabled: work for all inputs used.
##The above article The summary of front-end HTML knowledge points (recommended) is all the content shared by the editor. I hope it can give you a reference, and I hope you will support Script Home.
The above is the detailed content of Summary of HTML knowledge points. For more information, please follow other related articles on the PHP Chinese website!
: table head cell | : table data cell rowspan: 单元格竖跨多少行 colspan: 单元格横跨多少列(即合并单元格) |
: table header |
---|