HTML5的新特性_html 按空格折行-CSDN博客

本文链接：https://blog.csdn.net/qq_34771938/article/details/119680405

空白折叠现象

文字与文字之间的多个空格、换行会被折叠成一个空格。
标签“内壁”和文字之间的空格会被忽略。

<p>aaa   
    bbb

    ccc
</p>
<p>   www   </p>

转义字符

小于号：<

大于号：>

空格（不会被折叠）： 

版权符号©：©

示例：

<!-- 不使用转义字符 -->
<div>
    "<p></p>"是段落标签。
</div>

<!-- 使用转义字符 -->
<div>
    "&lt;p&gt;&lt;/p&gt;"是段落标签。
</div>

更丰富的input种类

type属性值	控件
color	颜色选择控件
date、time	日期、时间选择控件
email	电子邮件输入控件
file	文件选择控件
number	数字选择控件
range	拖拽条
search	搜索框
url	网址输入控件

示例：

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

<head>
    <meta charset="UTF-8">
    <title>First HTML Web</title>
</head>

<body>
    <!-- input新属性 -->
    <form action="">
        <input type="color">颜色选择<br>
        <input type="date">日期选择<br>
        <input type="time">时间选择<br>
        <input type="email">电子邮件输入控件<br>
        <input type="file">文件选择<br>
        <input type="number">数字输入控件<br>
        <input type="range">拖拽条<br>
        <input type="search">搜索框<br>
        <input type="url">网址输入控件<br>
    </form>
</body>

</html>

<datalist>控件

<datalist>控件可以为输入框提供一些备选项，当用户输入的内容与备选项文字相同时，将会显示智能感应。

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

<head>
    <meta charset="UTF-8">
    <title>First HTML Web</title>
</head>

<body>
    <!-- datalist使用 -->
    <p>
        游戏选择：
        <input type="text" list="game-list">
        <datalist id="game-list">
            <option value="LOL">
            <option value="cf">
            <option value="tft">
        </datalist>
    </p>
</body>

</html>