HTML

WEB标准

 结构(html)、表现(css)、行为(javaScript)

基本结构标签

<!DOCTYPE html>
<html lang="en">

<head>
    <title>标题</title>
    <meta charset="utf-8">
</head>

<body>
    网站内容
</body>

</html>

<!DOCTYPE html>文档类型声明标签

lang 当前文档的显示语言 en英文 zh-CN中文

<meta charset="utf-8">定义字符集 不写容易乱码

标签属性

标签属性是指标签的特性
class 为html元素定义一个或多个类名(classname)(类名从样式文件引入)
id 定义元素的唯一id
style 规定元素的行内样式(inline style)
title 描述了元素的额外信息 (作为工具条使用)

HTML常用标签

<h1>-<h6>标题标签
<p></p>段落标签
<br />换行标签

<div></div>定义了文档的区域,块级 (block-level) 独占一行
<span></span>用来组合文档中的行内元素, 内联元素(inline)

<img src="" alt="">图像标签 src是该标签的必须属性
<a href="" target="目标窗口的弹出方式" ></a>超链接标签 target属性 "_self"在当前窗口打开 "_blank"在新窗口打开

文本格式化标签

<strong></strong>and<b></b>文本加粗标签
<em></em>and<i></i>文本倾斜
<del></del>and<s></s>删除线
<ins></ins>and<u></u>下划线

表格标签

  <!--表格-->
    <table align="center" border="1px" cellspacing="0">
        <!-- 表格头部区域 -->
        <thead>
            <!--行-->
            <tr>
                <!--表头单元格 会居中 加粗-->
                <th> dd </th>
                <th> aa </th>
                <th> cc </th>
            </tr>
        </thead>
        <!-- 表格主体区域 -->
        <tbody>
            <tr>
                <!--列-->
                <td> d1 </td>
                <td> a1 </td>
                <td> c1 </td>
            </tr>
        </tbody>
    </table>

单元格的合并
属性:
colspan跨列合并
rowspan跨行合并单元格

列表

<!-- 定义无序列表 -->
    <ul>
        <!-- 每个元素 -->
        <li></li>
        <li></li>
    </ul>
    <!-- 定义有序列表 -->
    <ol>
        <li></li>
        <li></li>
    </ol>
 <!-- 自定义列表 -->
    <dl>
        <!-- 标题 -->
        <dt>名词</dt>
        <!-- 内容 -->
        <dd>解释</dd>
        <dd>解释</dd>
        <dd>解释</dd>
    </dl>

表单

表单标签

`<form></form>`  

属性:
method
action

<input>
属性:

  • Type: 类型

    • Type 的值所代表的效果

      • text:文本与<datalist>连用
      • password:输入的数据不可见
      • range:调节条形

            属性:min:设置最小值  
           *  max:设置最大值  
           *  step:设置单步调节大小  
           *  value:设置初始位置  
      • number:设置数字输入框
      • checkbox: 勾选框
      • radio:复选框
      • email:输入电子邮箱格式的数据
      • tel:输入电话的数据
      • url:输入url格式的数据
      • date:获取时间
      • color:获取颜色
      • image:图标按钮

        • file:上传文件
          特有属性:

          *multiple:一次允许上传多个文件*  
          *required:必须上传一个文件*  
        • hidden:隐藏表单 会提交
        • submit:提交按钮
        • button:普通按钮
  • name:名字
  • value:设置与填充 值
  • placeholder: 设置与填充或叫提示
  • maxlength: 设置最大数据长度
  • size: 设置输入框长度
  • readonly:只读效果
  • list:链接

<textarea></textarea>长表单

  • 属性:

    • rows:设置行数
    • cols:设置长度

<select></select>文本选择
<option></option>选项
<datalist></datalist>

Last modification:September 10th, 2020 at 09:59 pm
如果觉得我的文章对你有用,请随意赞赏