前端第一天html

前端第一天html

• 注释多行 alt shift a

• 放大网页 ctrl +

• 恢复正常比例 ctrl 0

在html和xml中只有一个根元素

lang：用来设置网页的语言，默认en英文网页

<hr>自动创建横线
<form action="" method="post">
  form表单收集用户输入的数据并提交到action链接的目的地

   method用于制定连接方式

  <input type="text" name="myname" value="" autocomplete="off" placeholder="请输入用户姓名(必填)" required autofocus>

• 单行文本输入框 type="text“ 注意如果不书写 type 属性,则默认就是单行文本输入框

• 单行文本密码框 type=“password”

• name:键值对的键

• value:键值对的值

• autocomplete:一般设置为 off 关闭自动完成功能

• placeholder:悬浮文本,用来进行提示操作,只要用户一书写则立刻消失

• required:表示必填

• autofocus:自动获取焦点

表单提交 get 和 post 的区别

• get:通过浏览器地址栏传递值,速度快,安全性低,不支持中文,传值格式为 目的地? key1=value1&key2=value2,最多传递2000 个字符,只能是字符串,链接提交可能是 get
• post:通过请求的消息体封装传输的数据,速度慢,安全性高,支持中文(不推荐) 通过浏览器f12 开发人员工具中的网络选项卡中的载荷可以看到传输的数据,没有大小限制,上传操作必须使用post

如何查看当前页面发送了多少个键值对

浏览器->f12->开发人员工具->网络->载荷->输入数据，提交

emmet语法规则

1. a>b:b为a的子标签
2. a+b:a与b为兄弟标签
3. a>b^c:c与a为兄弟标签   多个“^”表示与多个">"前的标签为兄弟标签
4. a*2>b:<a><b></b></a>
		 <a><b></b></a>
5. li.item$$$*5 <li class = "item001"></li> 到<li class = "item005"></li>
6. h$[title=item$]*3 <h1 title="item1"></h1> 到<h3 title="item3"></h3>
7. h{header $}*3 <h1>header 1</h1> 到 <h3>header 1</h3>
8.  @：丛几开始 -:从高降低到@后  不加负号：丛几开始增加
	例如：li.item$@-11*5 <li class="item15"></li> 到 <li class="item11"></li>
		li.item$@3*5 <li class="item3"></li> 到 <li class="item7"></li>
9. #：id		.:class		[]:中间为标签的属性，=后为值，不加等号默认=“”
	注意：p.class1.class2.class3  <p class="class1 class2 class3"></p>
10. >后不加标签的自动匹配父标签的子标签
	em>.class <em><span class="class"></span></em>
	ul>.class <ul><li class="class"></li></ul>
	table>.row>.col  <table><tr class="row"><td class="col"></td></tr></table>
	不加">" 直接点的默认为div的属性