zoukankan      html  css  js  c++  java
  • HTML

    HTML

    HTML是什么

    超文本标记语言(Hypertext Markup Language, HTML)是一种用于创建网页的标记语言。

    是一种浏览器可识别的规则

    HTML不是什么

    HTML是一种标记语言(markup language),它不是一种编程语言。

    HTML使用标签来描述网页。

    HTML注释

    <!--注释内容-->
    

    标签又称为:标记

        双闭合标签
            示例:<html></html>
        单闭合标签
            示例:<meta charset="UTF-8">
    
    

    标签分类

    块级标签:h1~h6, p, br, ht, div

    块级标签内部可以嵌套任意的块级标签和行内标签

    特列:p虽然是块级标签 但是它的内部只能嵌套行内标签 不能嵌套块级标签,如果嵌套了 没有问题 知识不符合html语法规范

    行内标签:u, s, i, b, span

    自身文本多大 就占多大

    行内标签内部不能嵌套块级标签和行内标签

    head标签

    1. title标签:显示网站的标题
    2. meta标签:提供有关页面的元信息
    3. style标签:定义内部样式表
    4. link标签:链接css资源文件、网站图标
    5. script标签:链接脚本js文件

    body标签

    标签基本标签

    h1~h6标题标签

    s: 删除线

    b: 加粗

    u: 下划线

    i: 斜体

    p: 独占一行

    br: 换行

    hr: 分割线

    段落标签

    p标签,每个段落都要用p标签包裹

    示例:<p>内容</p>

    超链接标签

    a标签

    示例:<a href="网址">内容

    a属性:

    1. href:链接新网址,回到顶部,跳转邮箱,下载文件
    2. title:鼠标悬浮上的标题
    3. style:行内样式
    4. target:目标 _self:默认值,在当前页面中打开新的链接

    ​ _blank:在新的空白页面打开新的链接

    清除下划线:

    text-decoration: none;

    none;无线

    underline:下划线
    overline:上划线
    line-through:删除线

    图片标签

    img标签

    示例<img src="" alt="头像">

    img属性:

    1. src:图片的资源地址
    2. alt:图片加载失败时显示的标题
    3. title:鼠标悬浮时显示的标题
    4. width:设置图片的宽度
    5. height:设置图片的高度

    字体标签

    1. 粗体标签:<b>或<strong>
    2. 斜体标签:<i>或<em>
    3. 上标:<sup>
    4. 下标:<sub>

    列表标签

    • 无序列表 <ul> ,无序列表中的每一项是<li>

    ul: unordered list

    li: list item(列表项)

    ul 属性:type

    1. disc: 实心圆点,默认
    2. square: 实心方点
    3. circle: 空心圆
    4. 设置为无序号: list-style: none

    2 有序列表 <ol> , 里面的每一项都是<li>

    ol: ordered list

    表格标签

    table标签

    表格:<table>, 表头:<th>, 行 <tr>, 列:<td>

    table属性:

    border: 边框

    cellspacing:单元格和单元格之间的距离(外边距)

    bordercolor:表格的边框颜色

    <table border='1' cellspacing=0>
     <th>
         <td>id</td>
         <td>name</td>
     </th>
     <tr>
         <td>1</td>
         <td>mjj</td>
     </tr>
    </table>
    

    form表单标签

    获取用户输入(选择,上传文件。。)并且将数据打包发送非后端

    action: 用来控制数据提交的路径(到底朝哪个后端服务器提交数据)

    三种写法:1.不写 默认就是朝当前该页面所在的地址提交数据

    ​ 2.全路径(https://www.baidu.com)

    ​ 3.只写路径后缀(/index/)

    method:表单数据的提交方式,默认get,还有post

    1. get: 明文提交,不安全,只能提交2kb信息,提交的内容会在地址上显示
    2. post: 密文提交,安全,可以提交大量信息
    3. enctype:表单数据的编码方式(加密方式),只能在post方式下使用

    input标签

    type属性:

    • text: 纯文本, password:密文

    • date: 日期,datetime-local: 准确时间

    • radio:多选一, checkbox: 多选多

    默认:checked="checked" 当标签的属性名和属性值相同的时候 可以只写属性名

    ​ 女<input type="radio" name="gender" checked="checked">

    ​ 简写

    ​ 女<input type="radio" name="gender" checked>

    • reset: 重置

    • button: 普通按钮

    • submit: 触发form表单提交动作

    • name: 提交到当前服务器的名称, value: 提交到当前服务器的值

    • file: 上传文件

    • textarea标签,获取大段文本, cols: 指定文本区域列数, rows指定文本区域行数

    lable通常是配合input一起使用

    for 属性规定 label 与哪个表单元素绑定。实现点击关联字光标在关联输入框闪烁

    点击lable标签内的内容, 会自动让对应的input标签 聚焦 (点击文字就可以把光标放到输入框内)

    <label for="d2">我是谁</label>
    <input type="text" id="d2">
    

    input获取到的用户输入就类似于是字典的value

    input中的name属性就类似于是字典的key

    select标签 下拉框, 一个个选项就是一个个option标签,可以加一个multiple该成多选

    ​ <select name="" id="" multiple>

    默认选中 selected="selected"

    能够触发form表单提交数据的按钮

    盒子标签

    div标签:division,分割

    定义:把网页分割成不同的独立的逻辑区域,必须独占一行

    div属性:

    align:设置区域的位置,可选left, right, center

    span标签

    定义:小区域标签,在不影响文本正常的情况下,单独设置对应的样式

    span和div的唯一区别:span是不换行的,div是换行的

  • 相关阅读:
    C# 操作配置文件
    C# Excel操作类
    没有找到 mspdb100.dll 的解决办法
    工厂方法模式
    .Net互操作2
    The certificate used to sign “AppName” has either expired or has been revoked. An updated certificate is required to sign and install the application解决
    手机抓包xcode自带命令行工具配合wireshark实现
    expecting SSH2_MSG_KEX_ECDH_REPLY ssh_dispatch_run_fatal问题解决
    使用ssh-keygen设置ssh无密码登录
    远程复制文件到服务器
  • 原文地址:https://www.cnblogs.com/kai-/p/12098703.html
Copyright © 2011-2022 走看看