a - table - ul - ol - dl - form - input

  1. <!DOCTYPE html> 文档声明头:告诉浏览器你要用h5标准来解析当前html文档
  2. 属性 用来描述同一类型标签的不同表现形式:既包含了样式方面,又包含了功能方面;属性和标签名是不区别大小写的。
  3. a 不能设置宽高,其内容多少决定了标签的大小。
    --href:指定超链接的目标网址(如果是线上地址,必须是以http开头的完整路径)
    --target:指定了目标链接的打开方式 target="_blank" 有下划线
  4. / 进入文件夹
    ./ 表示当前文件夹
    ../ 表示上一层文件夹
  5. 行为:结构层、表现层、行为层。

 6.1 锚点:页内跳转,地址栏上会拼接上targetId:
    <a href="#targetId">锚点测试</a> 和  <div id="targetId"></div> 一起使用
 6.2 手机上点击直接拨号,需要将电脑的IP地址设置链接手机上热点:<a href="tel:13902396243">点击联系我</a>
 6.3 <a href="sms:13902396243">发送短信</a>
 6.4 <a href="mailto:13902396243">发邮箱</a>
6.5  <a href="./img/paidaxing.jpg">下载图片</a>
  1. background是CSS中的属性,bgcolor只定义背景颜色,bgcolor是HTML中<table>的静态背景色,而background-color是JS里标签的背景色,不能混用。
  2. tr 表示 table 的一行
    <tr><th>字体粗,一般作为表头</th></tr>
    <tr><td>字体正常,一般作为内容</td></tr>
  3. --9.1无序列表 ul 中 li 前面的标记符号改成 实体方块
<ul type="square">
      <li>内容</li>
</ul>

--9.2有序列表(start 开始下标、type 指定序列号类型,默认123)

<ol start="4" type="a" reversed="reversed">
    <li>条目1</li>
    <li>条目2</li>
    <li>条目3</li>
    <li>条目4</li>
</ol>

会变成:
d.条目1
c.条目2
b.条目3
a.条目4

10.
image.png

11.form表单 块级元素
作用:前后端数据传输(可能是为了将本地数据传到后台,也可能是为了从后台获取数据。
<form align="center" method="get" action="http://192.168.199.141:3000/test.js" enctype="multipart/form-data"></form>

        restful API 规范标准 getInfo/id get ***高薪必学***
        form
            action-链接后台
            指定服务器(后台/接收数据)地址
            method 
            指定通讯的方法(常用get/post/put/delete)
                get与post 请求的区别
                    1.传值方式不同,get会把传递的值以url查询字符串的方式显示到地址栏里面,
                        而post是把要传递的值放在了 请求体 里面,相对来说post会更安全 一点,千万不要把带有密码的内容以get方式传递。(get 收藏夹后会完整保存信息)
                    2.传输数据量的大小,因为get的内容是放在地址栏的,但是地址栏能够传输数据大小是有限制的,
                        所以get方式传输数据大小是有限制的(3000字符左右),post方式理论上说没有大小限制的(一般服务器会设置上限)。
                    3.一般情况下需要从服务端 获取数据时 用到get方式,向服务端发送数据时用post请求。
                    4.当需要向后台传递文件信息(如头像)时必须 post 请求,同时修改 enctype 为 “multipart/form-data”,否则只能上传文本信息而不能上传文件。      

12.input

        <form  method="get" action="http://192.168.199.141:3000/test.js" enctype="multipart/form-data">
            <div>
                <!--input
                    name 告诉后台数据的名称
                    ***name 属性:指定向后台传值的字段(后台通过这个字段来获取用户输入)***
                    name的值应该同后台联系好定义什么,方便识别
                    
                    placeholder 空内容时提示内容
                    value 可以指定input的默认值
                    autofocus 自动聚焦输入位置 (可写成 autofocus 或者 autofocus="autofocus")
                    autocomplete 自动提示之前提交过的内容(也可以写在form里面) 自动默认是“on”
                    required 该字段是必填的,否则无法提交
                    readonly 只读 (不可修改)
                    disabled 禁用
                    
                    accpet 指定选定文件类型
                    step 步幅
                    multiple 设置多选
                    image/* 选择相册 或者 相机
                --> 
                姓名:<input  type="text" name="userName" placeholder="请输入你的大名" value="某某某" autofocus="autofocus" autocomplete="on" required="required" readonly="readonly" disabled="disabled" style="color:red"/>
            </div>
            <div>
                密码:<input type="password" name="psw" />
            </div>
            <div>
                头像:<input type="file" name="avatar" accpet="image/*" multiple="multiple"/>
            </div>
            <div>
                年龄:<input type="number" name="age" step="3" value="1"/>
            </div>
            <!--type:number 并不是说你只能输入数字,而是html会将内容尽量转为数字,
                            它在移动端时是非常有意义的,例如电话号码输入框(弹出数字键盘)
                
            -->
            <div>
                性别:
                <label><input type="radio" name="gender" value="0"/>男</label> 
                <input id="girl" type="radio" name="gender" value="1"/>
                <label for="girl">女</label>
                
                <!--
                    radio 单选  但是要加 name
                    checkbox 默认选中
                label 点击文字也可以选中-->
            </div>
            <div>
                爱好:
                <label><input type="checkbox" name="fav" value="a"/>凤姐</label>
                <label><input type="checkbox" name="fav" value="b"/>芙蓉姐姐</label>
                <label><input type="checkbox" name="fav" value="c"/>看凤姐大片</label>
                <label><input type="checkbox" name="fav" value="d"/>看芙蓉打牌</label>
                <!--
                    checkbox 多选
                a b c d 方便后台识别-->
            </div>
            
            <input type="hidden" value="哈哈" />
            <!--一般后台需要用的,用于提交, 不需要前端看到-->
            <button>button按钮</button>
            <!--写在form表单会默认成 提交按钮-->
            <input type="button" value="一个按钮"/>
            <input type="reset" value="重新输入"/>
            <input type="submit" value="登陆"/>
            <!--如用户名是bgg,密码是bgg123,在提交后网址后面会变成 userName=bgg&psw=bgg123
            -->
        </form>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 213,186评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,858评论 3 387
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,620评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,888评论 1 285
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,009评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,149评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,204评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,956评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,385评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,698评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,863评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,544评论 4 335
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,185评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,899评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,141评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,684评论 2 362
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,750评论 2 351