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