html基础

mac2022-06-30  23

web本质 浏览器输入网址 朝服务器发送请求 服务器接收请求 服务器返回相应的响应 浏览器接收响应解析渲染展示到屏幕上 http协议 超文本传输协议,规定了信息基于网络传输的发送及接收格式 http状态码 10X 服务器已经接收了你的请求,正在处理,你可以继续提交数据 20X 请求成功 30X 内部重定向 40X 请求错误 50X 服务器错误 html 超文本标记语言,规定了前端页面的书写标准 html注释 单行注释<!--这里写注释--> 多行注释<!-- 这就是多行注释 --> html文档结构 <!DOCTYPE html> <html> <head></head> <body></body> </html> head内常用标签 title 定义网页标题 link 引入外部css文件 script 在该标签内部直接写js代码,也可以引入外部js文件 style 内部写css样式语句 meta name='keywords' content='.....................'

body常用标签 基本标签 h1~h6 p a img b,u,i,s br hr 特殊符号   > < ® & © ¥ 常用标签(******) div用于页面布局 span普通小文本 a标签:链接标签,锚点,可以通过target控制是否是当前页跳转 img标签: src:图片地址 alt:图片未加载完成显示信息 title:鼠标悬浮上去显示文本 width:只需要调整一个,另一个自动按比例缩放 height 列表标签 无序列表 ul>li type disc,none,square,circle 有序列表 <ol type="i"> <li>aaa</li> <li>bbb</li> <li>ccc</li> </ol> 标题列表 <dl> <dt>标题1</dt> <dd>内容1</dd> <dd>内容2</dd> <dd>内容3</dd> <dt>标题2</dt> <dd>内容1</dd> <dd>内容1</dd> <dd>内容1</dd> <dt>标题3</dt> <dd>内容1</dd> <dd>内容1</dd> <dd>内容1</dd> </dl> 表格标签 <table> <thead></thead> <tbody></tbody> </table> table内 tr标签表示一行,tr里面可以放td,thead form表单(*******) 功能:前后数据交互,帮你提交任意的数据 input通过控制type属性来展示不同的获取用户输入的页面效果 type属性总结: text:纯文本 password:用户输入不可见 date:日期 比如:获取用户生日 radio:单选 比如:获取用户性别 checkbox:多选 比如:获取用户爱好 file:文件 获取用户上传文件 submit:提交 注意:form表单中只有input的type属性是submit才能支持提交 reset:重置 button:按钮 select:下拉框 默认是单选,可以通过multiple属性指定为多选 textarea:大段文本 label标签 本身没有任何实际意义,主要是配合input标签 <label for="">username: <input type="text"> </label> <label for="i1">username: <input type="text" id="i1"> </label> flask框架初窥 flask安装命令 pip install Flask flask三行式 请求方式 获取数据 get请求 提交数据 post请求标签分类(******) 块儿级标签(独占一行) h1~h6,p,hr,br 1.块儿级标签,可以嵌套其他块儿级标签和行内标签 2.p标签虽然也是块儿级标签,但是它不能嵌套任何块儿级标签,只能嵌套行内标签 行内标签(自身文本多大就占多大) span,b,u,i,s,a,img 1.行内标签肯定不能嵌套块儿级标签,只能嵌套行内标签 2.行内标签 无法设置长宽标签分类2: 双标签<h1></h1> 自闭和标签<img />URL:网址(uniform resource locator) 专业一点:统一资源定位符 url的组成: https://www.baidu.com/form表单中 action属性. 控制数据往哪提交,不写默认往当前url地址提交 method属性 控制数据提交的方式,默认是get请求,可以通过method该属性指定其他提交 提交数据的input必须要有name参数 input框中value属性就是对应的值

如果要提交文件数据 1.修改提交数据编码格式enctype 2.提交方式必须是post

form表单注意事项: action method默认是get enctype数据编码格式 form表单获取用户输入的标签都必须有name属性 form提

 

交数据必须借助于input标签type类型等于submit按钮才能触发提交效果

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action=""> <p> <label for="1"> 用户名:<input type="text" id="1"> </label> </p> <p> <label for="2"> 密 码:<input type="password" id="2"> </label> </p> <p> <label for="3"> 性别:<input type="radio" name="sex" checked id="3"><input type="radio" name="sex" ></label> </p> <p> <label for=""> 爱好:<input type="checkbox">篮球 <input type="checkbox">足球 <input type="checkbox">乒乓球 </label> </p> <p> 出生省份:<select name="" id="" > <option value="bj">北京</option> <option value="sh">上海</option> <option value="sz">深圳</option> </select> </p> <p> <select name="" id=""> <optgroup label="北京"> <option value="">朝阳</option> <option value="">海淀</option> </optgroup> <optgroup label="上海"> <option value="">浦东</option> <option value="">浦西</option> </optgroup> <optgroup label="深圳"> <option value="">宝山</option> <option value="">宝盒</option> </optgroup> </select>> </p> <p> 自我介绍:<textarea name="" id="" cols="30" rows="10"></textarea> </p> <p> <input type="submit" title="==================" value="注册"> <input type="reset" value="重置一下"> <input type="button" value="只是一个普通的按钮"> </p> </form> </body> </html> 试做简单HTML

 

转载于:https://www.cnblogs.com/98WDJ/p/10638450.html

最新回复(0)