HTML:HTML是前端页面标签语言,用来写前端的静态页面
使用pycharm专业版可以创建一个HTML文件,在写标签时,可写出完整的标签在使用tab键补全一对标签,或者使用<标签名>后自动补齐一对标签,使用ctrl+/ 注释代码
一个标准的HTML包含了head头部和body身体的部分,像是人体的头部和躯干部分
一个标准的HTML格式:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
</html>
head中一般只保存style样式和title,展示内容全部放在body中
h标签:一般是h1-h6,依次变小
<h1></h1> 标题标签h1 <h2></h2> 标题标签h2 <h3></h3> 标题标签h3 <h4></h4> 标题标签h4 <h5></h5> 标题标签h5 <h6></h6> 标题标签h6
<div></div>
块级标签,标签可以无内容,会占满整行HTML的标签,特点是没有任何属性(可通过浏览器-检查-右侧style中查看),可通过css装饰后成为任意一种标签
<span></span>
行内标签也叫内联标签,没有任何属性,必须要有内容,作用的长度就是内容的长度,可通过css装饰器变成任意一种标签
<input></input>
<!-- placeholder起提示作用,出现光标后文案自动消失-->
<!-- value 文案不消失,常用用法是自动填充账户密码-->
<!-- password 输入为密文-->
<!-- button,按钮点击页面不会刷新-->
<input type="text" placeholder="请输入用户名">
<input type="text" value="请输入用户名">
<input type="password">
<input type="button" value="登录">
<!-- radiod单选框,可通过相同的name互斥来实现单选-->
<!-- checkbox复选框,checkded="checked"实现默认选项-->
<span>男</span><input type="radio" name="sex">
<span>女</span><input type="radio" name="sex">
<span>篮球</span><input type="checkbox" >
<span>足球</span><input type="checkbox" checked="checked">
reset--重置必须要在form中
<form></form>
通过form标签来包裹,通常与input标签连用,实现向后端请求数据,form 有method属性,可实现get和post请求,get请求url上挂参数,post提交body中,input中有name属性,用来拼接参数实现接口传参
<!-- 与后端数据交互的方式:-->
<!-- 1、通过form标签包裹,实现表单提交-->
<!-- 2、异步提交,ajax ------->
<!-- 更注重用户体验,防止用户在多个表单填错一个表单后,会刷新掉所有的已填表单,异步提交后,如果出错后不会刷新表单-->
<form method="get" action="http://www.baidu.com">
<!-- onclick表示在button的后续操作;submit后页面会跳转,跳转到form知道的action地址-->
<input type="button" value="登录" onclick="alert(111)">
<input type="submit" value="注册" >
</form>
原文:https://www.cnblogs.com/bugoobird/p/13155760.html