怎么申请网站空间,克隆的网站怎么做数据库,贵阳双龙区建设局网站,做家乡网站目录
一、网页元素属性
1.全局属性
2.标签
2.1其他标签
2.2表单标签
2.3图像标签
2.4列表标签
2.5表格标签
2.6文本标签
二、编码
1.字符的数字表示法
2.字符的实体表示法
三、实践一下 一、网页元素属性
1.全局属性
id属性是元素在网页内的唯一标识符。
class…目录
一、网页元素属性
1.全局属性
2.标签
2.1其他标签
2.2表单标签
2.3图像标签
2.4列表标签
2.5表格标签
2.6文本标签
二、编码
1.字符的数字表示法
2.字符的实体表示法
三、实践一下 一、网页元素属性
1.全局属性
id属性是元素在网页内的唯一标识符。
class属性用来对网页元素进行分类。
title属性用来为元素添加附加说明。
style属性用来指定当前元素的 CSS 样式。
contenteditable属性允许用户修改内容。
spellcheck属性就表示是否打开拼写检查。
data-属性用于放置自定义数据。只能通过CSS或者JavaScript利用。
2.标签
2.1其他标签
dialog标签表示一个可以关闭的对话框。
details标签用来折叠内容浏览器会折叠显示该标签的内容。其中summary标签用来定制折叠内容的标题。
如何使用
details openopen
这是一段解释文本。
/details
details
summary这是标题/summary
这是一段解释文本。
/details 2.2表单标签 form标签用来定义一个表单所有表单内容放到这个容器元素之中。
fieldset标签是一个块级容器标签表示控件的集合用于将一组相关控件组合成一组。
legend标签用来设置fieldset控件组的标题通常是fieldset内部的第一个元素会嵌入显示在控件组的上边框里面。
label标签是一个行内元素提供控件的文字说明帮助用户理解控件的目的。
input标签是一个行内元素用来接收用户的输入。
type属性决定了input的形式。
表单标签如何使用
!DOCTYPE html
html
head
meta charsetutf-8
title/title
/head
body
fieldset
legend学生情况登记/legend
p年龄input typetext nameage/p
p性别input typetext namegender/p
/fieldsetlabel foruser用户名/label
input typetext nameuser iduserbr /限制输入input typetext idname namename required minlength4 maxlength8 size10brforminput typesearch idmySearch nameqplaceholder输入搜索词…… requiredinput typesubmit value搜索br /input typebutton value点击br /input typesubmit value提交br /input typereset value重置br /复选框input typecheckbox idagreement nameagreement checkedlabel foragreement是否同意/labelbr /单选框fieldsetlegend性别/legenddivinput typeradio idmale namegender valuemalelabel formale男/label/divdivinput typeradio idfemale namegender valuefemalelabel forfemale女/label/div/fieldsetbr /邮件类型input typeemail size40 listdefaultEmailsdatalist iddefaultEmailsoption valuejbond007mi6.defence.gov.ukoption valuejbourneunknown.netoption valuenfuryshield.orgoption valuetonystarkindustries.comoption valuehulkgrrrrrrrr.arg/datalistbr /
密码类型input typepassword idpass namepassword minlength8 requiredbr /
文件类型input typefile idavatar nameavatar acceptimage/png, image/jpeg
隐藏类型input idprodId nameprodId typehidden valuexm234jqbr /
数字类型input typenumber idtentacles nametentacles min10 max100
滑块类型input typerange idstart namevolume min0 max11/form/body
/html结果如下 2.3图像标签
img标签用于插入图片。它是单独使用的没有闭合标签。src属性指定图片的网址
img src图片路径 width200 height200 alt图片说明 /
2.4列表标签
ol标签是一个有序列表容器ordered list会在内部的列表项前面产生数字编号。
ul标签是一个无序列表容器unordered list会在内部的列表项前面产生实心小圆点作为列表符号。
li表示列表项用在ol或ul容器之中。
如何使用
有序列表
ol reversed start3 typeA
li列表项 A/li
li列表项 B/li
li列表项 C/li
/ol
无序列表
ul
li列表项 A/li
li列表项 B/li
li列表项 C/li
/ul
2.5表格标签
table是一个块级容器标签所有表格内容都要放在这个标签里面。
caption总是table里面的第一个子元素表示表格的标题。该元素是可选的。
thead、tbody、tfoot都是块级容器元素且都是table的一级子元素分别表示表头、表体和表尾。
colgroup是table的一级子元素用来包含一组列的定义。col是colgroup的子元素用来定义表格的一列。
tr标签表示表格的一行table row。如果表格有thead、tbody、tfoot那么tr就放在这些容器元素之中否则直接放在table的下一级。
th和td都用来定义表格的单元格。其中th是标题单元格td是数据单元格。
2.6文本标签
div是一个通用标签表示一个区块division。
p标签是一个块级元素代表文章的一个段落paragraph。
span是一个通用目的的行内标签即不会产生换行不带有任何语义。
br让网页产生一个换行效果。该标签是单独使用的没有闭合标签。
hr用来在一篇文章中分隔两个不同的主题浏览器会将其渲染为一根水平线。该标签是单独使用的没有闭合标签。
pre是一个块级元素表示保留原来的格式preformatted即浏览器会保留该标签内部原始的换行和空格。浏览器默认以等宽字体显示标签内容。
strong是一个行内元素表示它包含的内容具有很强的重要性需要引起注意。浏览器会以粗体显示内容。
em是一个行内标签表示强调emphasize浏览器会以斜体显示它包含的内容。
二、编码
1.字符的数字表示法
字符的码点表示法是#N;十进制N代表码点或者#xN;十六进制N代表码点比如字符a可以写成#97;十进制或者#x61;十六进制字符中可以写成#20013;十进制或者#x4e2d;十六进制浏览器会自动转换它们。
phello/p
!-- 等同于 --
十进制
p#104;#101;#108;#108;#111;/p
!-- 等同于 --
十六进制
p#x68;#x65;#x6c;#x6c;#x6f;/p
注意HTML 标签本身不能使用码点表示否则浏览器会认为这是所要显示的文本内容而不是标签。比如p一旦写成#112;或者#60;#112;#62;浏览器就不再认为这是标签了而会当作文本内容将其显示为p。
2.字符的实体表示法
- lt;
- gt;
- quot;
- apos;
- amp;
- ©copy;
- #num;
- §sect;
- ¥yen;
- $dollar;
- £pound;
- ¢cent;
- %percnt;
- *$ast;
- commat;
- ^Hat;
- ±plusmn;
- 空格nbsp;
三、实践一下
创建前端页面使用PHP将前端输入的账号和密码进行打印。
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/title
/head
bodyform methodget actiondemo.php账号input typetext nameusername idbr密码input typepassword namepassword idbrinput typesubmit value登录/form
/body
/html
?php
var_dump($_GET);
? 实践主要是认识在URL中的get和post的区别
1get是把参数数据队列加到提交表单的ACTION属性所指的URL中值和表单内各个字段一一对应在URL中可以看到。
2post是通过HTTP post机制将表单内各个字段与其内容放置在HTML HEADER内一起传送到ACTION属性所指的URL地址。用户看不到这个过程。
