2019-02-17笔记html续

a标签 href
image.png

1.<a href="qq.com">qq</a>
相当于打开。com文件
正规写法href=https://qq.com

2.不准用file协议,上传到github,用github预览功能

3.或者npm i -g http-server安装,直接做一个nodejsserver
http-server -c-1 不要缓存


image.png

image.png

4.a href="//qq.com"
a标签的无协议绝对地址 自动继承协议

5.相对路径 a href="xxx.html"
跳转到/XXX.html
6.只写锚点#,href=“#bilibili”
直接加到index.html/#bilibili
注意:锚点是不发出请求的 (页面的跳转)
7.href="?name=张翼翔",系统自动判断,index.html?name=张翼翔。以此发起get请求
GET /index.html?name=frank HTTP/1.1

a标签的href设置成#

1.a href="#" 时表示一个空链接,点击时链接停留在当前页面,相当于刷新当前页面,有时使用该方法实现刷新本页面功能。
如果href是空白,点击后刷新页面同时请求一次

2.后面可以跟任意标签的id,或者任意a标签的id或者name,点击链接就可以跳转到当前页面的这个节点的位置
``<div id="abc"></div>
<a name="bcd"></a>

<a href="#abc"></a> /跳转到div id="abc"><//
<a href="#bcd"></a> /跳转到a name="bcd"><//
<a href="#"></a> /跳转到当前页面的顶部/``


a[href=#]*7>img[src=#][alt="..."]


image.png

a和button
button不需要跳页面
点A按钮直接下载 其实是个跳转链接

image.png

整个包分\


a标签的js伪协议

<a href="javascript: alert(1);" name="price"></a>
希望点击之后不要跳转

formbiaodan没有提交按钮 就无法提交,除非js

get获取内容,post上传
把东西提交到服务器


image.png

路径就是字符串,



请求第四部分



urlencoded 把明文改成十六进制安文用百分号隔开

post默认把查询参数放到响应第四部分
get放url上

form a 标签都有target

image.png

提交到iframe里

a标签和form标签都能发请求,a是get页面,form是post

input 和button区别:input没有子元素
tpye难学,有很多属性,分别表示不同输入类型

<input type="button" value= "button">


method

属性规定如何发送表单数据,表单数据发送到 action 属性所规定的页面
method="get"


button

为什么button和subbmit区别
第一种情况,
<button>button</button>
button没写type,自动升级提交按钮
button 的 type 属性为 button,没法提交
submit是唯一确定能佛在form表单能不能点击提交的按钮


checkbox多选框

1.<input type="checkbox" value= "button">爱我
能勾,需要写些补充文字
2.写成<input type="checkbox" name=”loveme">
需要有内容才能提交上去


image.png

选中了是on,没选就没值,不是off 加上value=”yes",返回yse

3.需要点爱我,自动勾选,那就<input type="checkbox" id="xxx"><label for="xxx"(不写#)>aiwo</label>
标签label是为了input准备的(for),点爱我就等于点input,label的作用就是跟input关联

image.png

4.添加label标签, for=“xxx",id=xxx,for和id是一对,要一起出现。这样点击用户名直接选中输入框


更先进写法:


image.png

删掉id和for,label把input包裹起来
input是label子元素,自动建立关联
name必须写,提交时候才能带上name后的值


radio 单选框

一个原点

image.png
image.png

涉及radio,单选框


image.png

select下拉列表

<select name="group" multiple(多选) >
<option value="">-</option>//可以给个空值 什么也不选的意思
<option value="1">第一组</option>
<option value="2">第二组</option>
<option value="3" disabled>第三组</option>选不了
<option value="4" selected>第四组</option>默认


textarea

<textarea style="resize: none; width:200px;height:100px;"name="爱好" id="" cols="30" 3列的意思不跟字的宽度严格一致rows="10"></textarea>

table

表头 th 表脚 tf tbudy
table data:td

th td区别


image.png

col和colgroup

image.png

tfooter位置不影响顺序
不写tbody,系统自动补上
不写thead,都放进body里

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,534评论 1 45
  • 在上一个章节,我们已经创建了一个基础的Blog程序。现在我们将使用一些Dajngo高级功能,去实现一个完整的blo...
    金金刚狼阅读 3,708评论 1 12
  • 一,有序列表、无序列表、自定义列表如何使用?写个简单的例子。三者在语义上有什么区别?在哪些情况下使用哪种(重要)?...
    kingBirds阅读 870评论 0 0
  • 一群可爱的孩子,我想我一直等着他们的生日,就如今日崔玉杰小弟弟的生日一般,热闹的不得了! 对,...
    大江小伟阅读 191评论 0 2
  • 人生流连数十载, 风霜凄迷。 梦在北方。 梨花落尽秋色黄。 如今天涯流连处, 蓝蓝星光。 往事难忘。 真诚可待流年殇。
    橡舍予阅读 267评论 2 8

友情链接更多精彩内容