• HTML5css3学习总结(1)


    什么是 HTML5

    HTML5 是下一代 HTML 标准。

    现在的HTML5 仍处于完善之中。然而,大部分现代浏览器已经对HTML5 支持。html5css3大部分应用在移动端。这里不谈兼容性,你懂的!!!、

    HTML5 中的一些非常有趣的新特性:

    • 用于绘画的 canvas 元素
    • 用于媒体播放 video 和 audio 元素
    • 对本地离线存储数据的更好的支持
    • 新的特殊内容元素
    • 新的表单控件

    新的选择器:

    属性选择器
        [attr=value]       属性选择 属性attr的值以val开头的元素。
        [attr$=value]      结尾匹配  属性attr的值以val结尾的元素
        [attr|=value]       匹配以横线连接的单词,首个单词为value
        [attr~=value]      匹配空格隔开的单词,有value则被选中
        [attr*=value]       属性att的值包含val字符串的元素;

    结构伪类选择器
        :nth-child(n){}   选择第n位置的
        :nth-last-child() odd even 2n+1 2n
        :last-child{}
        :first-child{}

    文本伪类选择器
        :first-letter
        :first-line
        ::selection

    其他选择器
        ul > li
        :not()
        :target 被锚点锚住的元素
        :after
        :before
    ------

    颜色表达
        rgb(0,0,0)
        rgba(0, 0, 255, 0.32)最后一个参数用来表示通明度;

    ------
    圆角
        border-radius
            10px
            10px 20px
            10px 20px 30px
            10px 20px 30px 40px

        10 20 30 40(x轴半径)/10 20 30 40(y轴半径)
    ------
    阴影
        box-shadow: 10px 20px 10px 60px black;
                    x位移 y位移 模糊半径 弥散半径 阴影颜色,第四个参数可以省略;
    ------
    变形
        transform:rotate(20deg)

        deg -> degree
    ------
    动画
        补间动画
            transition
        逐帧动画
            animation
    ------

    语义元素

    HTML5 添加了很多语义元素如下所示:

    标签描述
    <article> 定义页面独立的内容区域。
    <aside> 定义页面的侧边栏内容。
    <bdi> 允许您设置一段文本,使其脱离其父元素的文本方向设置。
    <command> 定义命令按钮,比如单选按钮、复选框或按钮
    <details> 用于描述文档或文档某个部分的细节
    <dialog> 定义对话框,比如提示框
    <summary> 标签包含 details 元素的标题
    <figure> 规定独立的流内容(图像、图表、照片、代码等等)。
    <figcaption> 定义 <figure> 元素的标题
    <footer> 定义 section 或 document 的页脚。
    <header> 定义了文档的头部区域
    <mark> 定义带有记号的文本。
    <meter> 定义度量衡。仅用于已知最大和最小值的度量。
    <nav> 定义导航链接的部分。
    <progress> 定义任何类型的任务的进度。
    <ruby> 定义 ruby 注释(中文注音或字符)。
    <rt> 定义字符(中文注音或字符)的解释或发音。
    <rp> 在 ruby 注释中使用,定义不支持 ruby 元素的浏览器所显示的内容。
    <section> 定义文档中的节(section、区段)。
    <time> 定义日期或时间。
    <wbr> 规定在文本中的何处适合添加换行符。
    删除的HTML标签

    • 纯表现的元素:
      • basefont
      • big
      • center
      • font
      • s
      • strike
      • tt
      • u
      • frame
      • frameset
      • noframes
      • acronym
      • applet
      • isindex
      • dir
      • 重新定义的HTML标签
        • <b> 代表内联文本,通常是粗体,没有传递表示重要的意思
        • <i> 代表内联文本,通常是斜体,没有传递表示重要的意思
        • <dd> 可以同detailsfigure一同使用,定义包含文本,ialog也可用
        • <dt> 可以同detailsfigure一同使用,汇总细节,dialog也可用
        • <hr>表示主题结束,而不是水平线,虽然显示相同
        • <menu> 重新定义用户界面的菜单,配合commond或者menuitem使用
        • <small> 表示小字体,例如打印注释或者法律条款
        • <strong> 表示重要性而不是强调符号                                                                                                                                                                                                                          

        • 语义化标签可以更好被搜索引擎收录。方便程序员阅读代码结构。自己在写代码的时候思路也能清晰!!!总之好处多多。
    11
  • 相关阅读:
    SQL Server 2008 允许远程链接 解决方法
    对上传图片进行剪切的jquery插件
    解决在IE6 下,css中的position:fixed 不起作用的办法
    对网站搞评比投票活动的总结
    关于设置sql server 2008服务器属性时出现的无法加载xplog70.dll文件的问题
    Android LayoutInflater的使用
    在Android中查看和管理sqlite数据库
    android开发的WARNING: Could not initialize OpenglES emulation, using software renderer问题的解决
    Android 常用错误及解决方法
    解决MyEclipse启动速度慢,提高MyEclipse启动速度
  • 原文地址:https://www.cnblogs.com/milx/p/6118035.html
Copyright © 2020-2023  润新知