博主信息
博文 3
粉丝 0
评论 0
访问量 3019
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
html文档结构与html元素三大分类与不同级别的样式规则
贝塔
原创
823人浏览过

html文档结构

  • html
    • head
      • meta
      • title
    • body
      • div
        ……
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>html文档结构</title>
  7. </head>
  8. <body>
  9. <div>
  10. 内容区域
  11. </div>
  12. </body>
  13. </html>

对象

  1. 含义
    所有事物皆可为对象。例如:显示浏览器窗口window,html文档document
  2. 利用js获取对象(可以利用控制台调试)
  • 返回当前窗口对象
    1. console.log(window)
  • 返回html对象,
    1. console.log(window.document)
    可以省略window
    1. console.log(document)
    查看当前url
    1. console.log(document.URL)

HTML三大属性

  1. id属性:获取页面中的唯一元素
    js获取方式

    1. document.getElementById('id')

    css获取方式

    1. #id{color:#aaa;}
  2. class属性:获取页面中的一类元素
    js获取方式

    1. document.getElementsByClassName('class')

    推荐用法

    1. document.querySelectorAll('.class')

    css获取方式

    1. .class{#aaa;}
  3. style属性:设置某个元素的内联样式

  4. 样式优先级:

    • 元素级 < class类级 < id级 < 脚本级
    • 外联样式文件 < style标签 < style内联属性
批改老师:GuanhuiGuanhui

批改状态:合格

老师批语:写的很认真,非常好!继续坚持!
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学