zoukankan      html  css  js  c++  java
  • HTML知识点总结

    1.常见浏览器内核

    Chrome: Blink

    Opera: Webkit

    Firefox: Gecko

    IE:Trident

    Safari:WebKit

    2.web标准三层组成

    结构(网页元素)、表现(外观样式)和行为(交互)

    3.标签语义化

    在合适的位置放上合适的标签,让网页结构更清晰。先确定语义化标签,再选用合适的CSS。

    优点: 1.方便阅读和维护

                2.浏览器更好地解析

                3.利于搜索引擎优化

    4.常用标签

    4.1 排版标签:标题 h、段落 p、水平线 hr、换行 br、span或div

    4.2 文本格式化标签:加粗 b / strong、倾斜 i / em、下划线 u / ins、删除线s / del

    4.3 图像标签 img

    属性:src必须、alt没有内容时、title悬停时显示、width、height、border

    4.4 链接标签 a 

    属性:href

    4.5 注释标签:<!--   -->

    4.6 表单:

    表单域 form

    表单控件:input组 type=[text、password、checkbox、button、submit、reset、image、file]、select组、textarea

    表单属性:value、selected、checked

    4.7 表格 - 展示数据,更整齐和规范

    组成:tr、td、th

    属性:cellspaceing单元格之间的距离

               cellpadding单元格内容与边框的距离

    标题: caption

    合并:跨行合并 rowspan、跨列合并 colspan

          1. 先确定跨行or跨列

          2. 先上后下、先左后右,找到目标单元格的rowspan 和 colspan

          3. 删除的个数等于合并数-1

    4.8 列表

    5. HTML5

    新语义化标签、本地存储、连接特性、网页多媒体、三维及图形特效

    5.1语义化标签

    header、nav、article、section、aside、footer

    5.2多媒体标签audio和video

    audio(支持ogg、mp3、wav格式),使用多个source支持多种格式。 

    <audio src="./music.mp3" autoplay controls loop>

      <source src="./music.mp3" type="audio/mpeg">

      <source src="./music1.ogg" type="audio/ogg">

      换个浏览器吧

    </audio>

    chrome禁用了autoplay,

    video(支持ogg、mp4、webm)

    chrome禁用了autoplay,可以添加muted(静音)属性解决

    poster是没有播放时的图片

    5.3 表单

    移动端表现更好,如显示不同的键盘及输入picker控件

    input  type=[email、url、date、time、month、week、number、tel、search、color]

    表单属性:required、placeholder、autofocus(自动获得焦点)、autocomplete(off / on, 表单需要name属性,会自动提示提交过的值)、multiple多选文件提交

  • 相关阅读:
    Essential C++ 3.1 节的代码练习——哨兵方式
    Essential C++ 3.1 节的代码练习——指针方式
    《搞不定人,你如何带团队?》读书记录
    selenium+python,解决selenium弹出新页面,无法定位元素的问题(报错:Unable to locate element:元素)
    selenium 元素(class_name、link_text、css_selector)定位方法
    selenium+python+eclipse 实现 “问卷星”网站,登录与检查登录示例!
    selenium IDE中log的保存与查看方法
    selenium IDE工具页面介绍!
    selenium IDE 使用方法整理
    selenium IDE的3种下载安装方式
  • 原文地址:https://www.cnblogs.com/jyughynj/p/13413737.html
Copyright © 2011-2022 走看看