• 1.HTML基础


    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>测试</title>
    </head>
    <body>
        <h1>我的第一个标题</h1>
        <p>我的第一个段落。</p>
    </body>
    </html>

    1.超文本标记语言(Hyper Text Markup Language,简称HTML)是一种用于创建网页的标准标记语言,

      运行在浏览器上,由浏览器解析。后缀名可以为.html或htm.(由于有的系统如DOS windows 3.1以及3.2只支持三个字符长的后缀名,现在大部分系统都支持长的后缀名了)

    2.对于中文网页需要使用 <meta charset="utf-8"> 声明编码,否则会出现乱码。有些浏览器(如 360 浏览器)会设置 GBK 为默认编码,则你需要设置为 <meta charset="gbk">。

    3.用<!—注释—>注释

    4.标签不区分大小写,建议使用小写。

    5.请始终将正斜杠添加到子文件夹。假如这样书写链接:href="//www.w3cschool.cn/html",就会向服务器产生两次 HTTP 请求。

        这是因为服务器会添加正斜杠到这个地址,然后创建一个新的请求,就像这样:href="//www.w3cschool.cn/html/"。 

    6.a 标签download可以实现点击下载的下载

    7.<audio>: HTML5 提供的用来播放音频文件的。(<video> 是用来播放视频的)

    8.使用超链接

    如果网页包含指向媒体文件的超链接,大多数浏览器会使用"辅助应用程序"来播放文件。

    雅虎媒体播放器 - 一个简单的添加音频到你网站上的方式
    使用雅虎播放器是免费的。如需使用它,您需要把这段 JavaScript 插入网页底部:
    
    雅虎播放器可以播放MP3以及其他各种格式。你只需添加一行代码到你的页面或 博客中就可以轻松地将您的HTML页面制作成 专业的播放列表:
    
    <a href="horse.mp3">Play Sound</a>
    
    <script src="http://mediaplayer.yahoo.com/latest"></script>

    9.<base>  在<head>中间<title> 后,定义了页面上所有链接的默认url

    打不开的链接就用这个链接。

    10.<datalist> 标签需要与 <input> 标签配合使用,用来表示可选的列表。 

    <form action="/statics/demosource/demo-form.php" method="get">
    <input list="browsers" name="browser">
    <datalist id="browsers">
      <option value="Internet Explorer">
      <option value="Firefox">
      <option value="Chrome">
      <option value="Opera">
      <option value="Safari">
    </datalist>
    <input type="submit">
    </form>
    
    <p><strong>注意:</strong> Internet Explorer 9(更早IE版本),Safari不支持 datalist 标签。</p>

    11.<embed>:<embed> 标签用来定义在页面中嵌入的内容,比如插件。(和<object>可以实现同样的效果)

    12.<fieldset>:对表单中的相关元素进行分组:

    <form>
     <fieldset>
      <legend>个人信息1:</legend>
      姓名: <input type="text"><br>
      邮箱: <input type="text"><br>
      生日: <input type="text">
     </fieldset>
     <fieldset>
      <legend>个人信息2:</legend>
      姓名: <input type="text"><br>
      邮箱: <input type="text"><br>
      生日: <input type="text">
     </fieldset>
    </form>

     13..disabled(New):除了 Internet Explorer 和 Safari,其他主流浏览器都支持 disabled 属性。禁用某些表单

    14<label>定义了 <input> 元素的标签,一般为输入标题

    <form action="/statics/demosource/demo-form.php">
      <label for="male">Male</label>
      <input type="radio" name="sex" id="male" value="male"><br>
      <label for="female">Female</label>
      <input type="radio" name="sex" id="female" value="female"><br><br>
      <input type="submit" value="提交">
    </form>

     15.<optgroup> 标签用于对 <select> 元素所提供的选项进行分组。

    <select>
      <optgroup label="Swedish Cars">
        <option value="volvo">Volvo</option>
        <option value="saab">Saab</option>
      </optgroup>
      <optgroup label="German Cars">
        <option value="mercedes">Mercedes</option>
        <option value="audi">Audi</option>
      </optgroup>
    </select>

    16.<output> 标签显示计算或用户操作的结果,该标签是 HTML5 中的新标签。

    <form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
      <input type="range" id="a" value="50">100
      +<input type="number" id="b" value="50">
      =<output name="x" for="a b"></output>
    </form>

    17. autocomplete 规定是否启用表单的自动完成功能。autocomplete="on"  autocomplete="off" 自动完成允许浏览器预测对字段的输入。

    填写并提交表单,然后重载页面,再次填写表格,autocomplete 点击就可以加载上次填过的内容。

    18.novalidate 如果使用该属性,则提交表单时不验证。

    <form action="demo_form.html" novalidate>
    E-mail: <input type="email" name="user_email">
    <input type="submit">
    </form>

    19.<h1>  标题标签 (h1到h6,超过6无效果)

    20.<iframe>  标签规定一个内联框架,通过使用框架,你可以在同一个浏览器窗口中显示不止一个页面。

    <iframe src="/statics/demosource/demo_iframe.htm" width="200" height="200"></iframe>
    
    <p>一些旧的浏览器不支持 iframe。</p>
    <p>如果浏览器不支持 iframes 则不会显示。</p>

    1)Iframe - 设置高度与宽度:width和height

    2)Iframe - 移除边框:frameborder="0"

       3)使用iframe来显示目录链接页面

           iframe可以显示一个目标链接的页面

           目标链接的属性必须使用iframe的属性,如下实例:

    <iframe src="/statics/demosource/demo_iframe.htm" name="iframe_a"></iframe>
    <p><a href="http://www.w3cschool.cn" target="iframe_a">W3CSCHOOL.CN</a></p>
    
    <p><b>注意:</b> 因为 a 标签的 target 属性是名为 iframe_a 的 iframe 框架,所以在点击链接时页面会显示在 iframe框架中。</p>

    21 autofocus(New):属性规定当页面加载时 <input> 元素应该自动获得焦点

    22.checked: checked 属性规定在页面加载时应该被预先选定的 <input> 元素。 (只针对 type="checkbox" 或者 type="radio")

    23.form(New): form 属性规定 <input> 元素所属的一个或多个表单

    24.formaction(New): 属性规定当表单提交时处理输入控件的文件的 URL。(只针对 type="submit" 和 type="image")

    25.formenctype(New):属性规定当表单数据提交到服务器时如何编码(只适合 type="submit" 和 type="image")

    26.formmethod(New): 定义发送表单数据到 action URL 的 HTTP 方法。 (只适合 type="submit" 和 type="image")

    27.formnovalidate(New) :formnovalidate 属性覆盖 <form> 元素的 novalidate 属性

    带有两个提交按钮的表单(一个进行验证,另一个不进行验证):

    <form action="demo-form.php">
    E-mail: <input type="email" name="userid"><br>
    <input type="submit" value="提交"><br>
    <input type="submit" formnovalidate="formnovalidate" value="不验证提交">
    </form>

    28.multiple(New):属性规定允许用户输入到 <input> 元素的多个值

    <!--可接受多个值的文件上传字段-->
    <form action="demo-form.php">
     选择图片: <input type="file" name="img" multiple>
     <input type="submit">
    </form>

    29placeholder(New):placeholder 属性规定可描述输入 <input> 字段预期值的简短的提示信息。

    30.readonly:readonly 属性规定输入字段是只读的

    31.required(New): 属性规定必需在提交表单之前填写输入字段

    32.setpstep(New) 属性规定 <input> 元素的合法数字间隔:

    33.<meat> 描述HTML 的描述,关键词,作者,字符集等的标签

  • 相关阅读:
    百度诉360案一审宣判索赔1亿判赔70万
    软件设计之状态机
    linux下so获得自己文件位置的路径
    openssh-server
    安卓下查看kmsg内核日志
    Python kmean
    numpy
    HostMonitor监控主机状态
    ubuntu MySQL安装和设置
    Python Post img
  • 原文地址:https://www.cnblogs.com/lukelook/p/9199653.html
Copyright © 2020-2023  润新知