web-01

1、html常用标签(标记)

    1)标记类型

        * 双标记:<标记名>内容</标记名>

        * 单标记:<标记名 属性名=“属性值” 属性名1=“属性值1”>

        注:<br>换行标签特殊,不需要属性

    2)body部分

        * 1. <br>:html中手动换行是不识别的

        * 2. <p></p>:段落标签,有换行功能

        * 3. <img src="" alt="">

           src:放图片资源路径

           alt:图片无法显示时的显示信息

        * 4. <a href=""></a>

            href:连接的跳转地址

       注:路径问题

           (1)相对路径:从当前文件路径下去找指定文件

<a href="1.txt">请点我</a>   //1.txt与该文件平级
<a href="../2.txt">请点我</a> //2.txt在该文件的上一级,加“..”退回上一级找

           (2)绝对路径:从磁盘下找

<a href="D:/a/1.txt">请点我</a>

     注:a 链接的使用场景

          (1) 点击图片跳转页面

<a href="new 1.txt"><img src="koala.jpg"></a>

          (2) a 标签中target

<a href="" target="_blank"></a>

                _blank:在新窗口中打开链接

                _self:(默认值)在当前窗口打开链接

          (3)锚点(实现当前页面的操作)

<!--1.立标记-->
<a name="top"></a>
<!--找锚点(找标记)-->
<a href="#top">回到顶部</a> //点击回到指定位置,用"#"去获取

        * 5. 列表标签

             ul>li --->  无序列表/有序列表

        * 6. 表格标签(table)

* align:对齐方式(水平方向) left|right|center
* height/width:高度/宽度
* border:边框
* cellspacing="0":格子与格子之间距离
* cellpacing:格子与文字之间的距离
* text-align:center; 文本居中
注:合并行列都是在td中
* colspan:列合并
* rowspan:行合并

2、form表单

    1)作用

        a. 主要用来收集用户信息

        b. 通常结合输入标签等一起使用

    2)表单元素

        * 1、action:提交地址(url)

        * 2、method:提交方式(get/post)

        * 3、input:文本输入框(根据type不同实现不同的功能)

text:普通文本
password:密码输入框
submit:提交按钮
button:普通按钮
radio:单选按钮,必须设置name属性,这样才能在一个组里面
checkbox:复选按钮
file:文件上传
reset:重置
注:程序自定义(牵扯到后台)的要写value,否则可以不写
value:可以设置值或获取值
name:用于生成传给后台的键(key)

        * 4、下选框

           select>option

        * 5、文本区域框

           textArea

    注:<iframe></iframe>在页面引入一个页面,作为本页面的一部分

3、H5

    input的type值:

* date:日历效果
* datetime-local:日期和时间
* time:时间
* month:月份
* email:邮箱
<input type="url" required placeholder="请输入网址">:地址
* color:选择颜色
<input type="number" min="1" max="10">:只能填数字
<input type="range" value="10" max="50" step="10">
原文地址:https://www.cnblogs.com/xslzwm/p/9590615.html