网站开发按前端后端分解,网站建设公司服,企业网站建设的价格,做网站打电话怎么和客户说标签的分类 关于标签我们可以分为 #xff1a; 单标签#xff1a;img, br hr 双标签#xff1a;a#xff0c;h,div 按照属性可分为#xff1a; 块儿标签#xff08;自己独自占一行#xff09;#xff1a;h1-h6, p,div 行内#xff08;内联#xff09;标签#xff08…标签的分类 关于标签我们可以分为 单标签img, br hr 双标签ah,div 按照属性可分为 块儿标签自己独自占一行h1-h6, p,div 行内内联标签自身多大就占多少a, span,u,i,b 当我们输入h标签和a标签时可以看到 我们所输入的结果是这样的其实这就是块儿标签和行内标签的区别 div标签和span标签 div和span标签单独拿出来是没有任何意义的主要的作用是页面布局在布局当中 div的作用是占位置布局 span是文本布局 标签的嵌套 标签之间是可以互相嵌套的块儿级元素是可以嵌套所有的标签要注意的是p标签不能嵌套块儿级元素但是可以 嵌套行内元素 行内元素只能嵌套行内元素不能嵌套块儿级元素 针对前端来说不会轻易的报错如果我们写的不对只会没有对应的效果 例
我们以小米商城为例在小米商城中可以发现这些都是使用div用来占位的而span是文本占位
并且使用了标签的嵌套。 img标签
关键字 src
img标签是展示图片的 如果width设置了width“500px” height“200”如果不一致则会出现变形失真所以一般情况下只写一个就行。 当图片损坏时在alt中填写内容时会发现 我们也可以不使用外链使用本地的图片 这样就出来了 当地址文件不在当前文件夹内时我们可以使用 如果在上一级时也可以使用 总结src 1. 可以使用外链的地址 2。 可以使用本地的地址 title 鼠标悬浮的时候显示的内容(是所有标签都要的) width: 图片的宽度 height图片的高度 alt当图片不存在的时候显示的内容 a标签
关键字 href
target 后面如果是_self 自己直接跳转到页面了但是如果是_blank 则会新建页面然后跳转 标签自带的两种属性
id 值一个文本中只能有唯一的id值id值不能重复
class 值一个标签可以有多个class值一个class值可以被多个标签使用
当我们使用标签c1来找可以找到d1d3 和d4.想要使用id值必须使用#查找
想要使用class值时使用点.查找
div idd1 classc1/div
div idd2 classc2/div
div idd3 classc1 c2 c3/div
div idd4 classc1/div列表
关键字ul
无序列表 body
ulli第一个/lili第二个/lili第三个/li
/ul/body 可以更改上面的符号 body
ul typecircleli第一个/lili第二个/lili第三个/li
/ul/body type属性 disc实心圆点默认值circle空心圆圈square实心方块none无样式 有序列表
关键字olol 区别就是加上了序号使用type可以更改 ol typeIli第一个/lili第二个/lili第三个/li
/ol type属性 1 数字列表默认值A 大写字母a 小写字母Ⅰ大写罗马ⅰ小写罗马 标题列表 关键字dl /oldldt标题1/dtdd内容1/dddt标题2/dtdd内容2/dd/dl
/body 表格 添加多行数据 !DOCTYPE html
html langen
headmeta charsetUTF-8titleTitle/title
/head
body
table border2theadtrthid/ththname/ththage/ththgender/ththsalary/th/tr/theadtbodytrtd1/tdtdkiki/tdtd21/tdtdfemale/tdtd22222/td/trtrtd2/tdtdkiki1/tdtd22/tdtdmale/tdtd12222/td/tr trtd3/tdtdlll/tdtd25/tdtdfemale/tdtd22242/td/tr/tbody
/table/body
/html 加上边框结果table 属性 属性: border: 表格边框.cellpadding: 内边距cellspacing: 外边距.width: 像素 百分比.最好通过css来设置长宽rowspan: 单元格竖跨多少行colspan: 单元格横跨多少列即合并单元格 form表单标签 input加上属性 !DOCTYPE html
html langen
headmeta charsetUTF-8titleTitle/title
/head
body
form action
!-- 使用div或p都可以--div
!-- lable for/lable点击后直接选中填写绑定id值--label for1账号:input typetext id1/label/divdivlabel for2
!-- typepassword所填密码使用密文显示--密码input typepassword id2/labelplabel for3
!-- typedate表示日期--日期input typedate id3/label/pplable这是按钮input typebutton value普通按钮/lable/pp
!-- 添加复选(多选)--input typecheckbox 读书input typecheckbox 游戏input typecheckbox 足球/pp
!-- 添加单选需要id一致--input typeradio namegender / 男input typeradio namegender / 女input typeradio namegender / 未知/ppinput typesubmit value登录input typereset
!-- 选择单个文件--
!-- input typefile--
!-- 选择多个文件--input typefilemultiple/ppselect name idoption value上海/optionoption value北京/optionoption value安徽/option/select/p/div/form
/body
/html 结果 input 元素会根据不同的 type 属性变化为多种形态 属性说明: name表单提交时的“键”注意和id的区别value表单提交时对应项的值 typebutton, reset, submit时为按钮上显示的文本年内容typetext,password,hidden时为输入框的初始值typecheckbox, radio, file为输入相关联的值 checkedradio和checkbox默认被选中的项readonlytext和password设置只读disabled所有input均适用 select标签
pselect name idoption value上海/optionoption value北京/optionoption value安徽/option/select/p
属性
multiple布尔属性设置后为多选否则默认单选disabled禁用selected默认选中该项value定义提交时的选项值 验证form表单朝后端提交数据 !DOCTYPE html
html langen
headmeta charsetUTF-8titleTitle/title
/head
body
form actionhttp://127.0.0.1:5000/index
!-- 使用div或p都可以--div 后端 from flask import Flask,request
app Flask(__name__)#路由网络的路径
app.route(/index,methods[GET,POST]) # 默认情况下只允许get提交加上methods[GET, POST]
def index():print(sasas)print(request.form) # 接受post提交过来的数据print(request.files) # 接受文件的returnindex
app.run( form action action: 填写的是后端提交的地址 这里你写什么地址就朝这个地址提交数据应该填写后端的地址 1. 什么都不写朝当前地址提交 2. 全写http://127.0.0.1:5000/index/ 朝这个地址提交 3. 只写后缀 /index/--------IP:PORT/index 后端的结果就是所填的内容 form表单要想把数据提交到后端每一个标签都要有一个name属性 name的属性值就是提交到后端数据的key值用户输入的内容就是value值 针对于复选框、单选框标签都应该有一个value属性用于区别前端用户选择的哪个选项 1. 请求方式必须是post 2. 数据编码方式 1. application/x-www-form-urlencoded 2. multipart/form-data 3. json 3. 编码方式必须是multipart/form-data才能提交问价 4. urlencoded只能够提交不是文件的数据form-data是可以提交普通数据和文件数据 5. urlencoded形式的数据长什么样子 usernamepassworddatehidden123myfilecity 6. form-data编码格式的数据 usernamepassworddatehidden123myfilecity boundary----WebKitFormBoundaryhwrBD6WMC3rBJXOy 文件数据 对于form-data提交的数据后端还是在form里面去普通数据而在files里面去文件数据 7. form表单不能够提交json数据 8. 如果想提交json格式的数据Ajax技术、第三方的api工具postman
