经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置:技术经验 » HTML/CSS » CSS » 查看文章
【HTML】笔记(4)--- 元素的id属性;div和span
来源:cnblogs  作者:猿头猿脑的王狗蛋  时间:2022/1/17 10:48:07  对本文有异议

1、HTML中元素的id属性:

笔记:

1、在HTML文档当中,任何元素(节点)都有id属性,id属性是该节点的唯一标识。所以在同一个HTML文档当中id值不能重复。

2、注意:表单提交数据的时候,只和name有关系,和id无关。

3、id有什么用?
                javascript可以对HTML文档当中的任意节点进行增删改,那么增删改之前需要先拿到这个节点,通常我们通过id来拿节点对象。
                id的存在让我们获取元素(节点)更方便。

4、HTML文档是一棵树,树上有很多节点,每一个节点都有唯一的id。
                javascript主要就是对这棵DOM树上的节点进行增删改的。
                DOM(Document)树。

代码:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>HTML中元素的id属性</title>
  6. </head>
  7. <body id="mybody">
  8. <form id="myform">
  9. <input type="text" id="username" name="username"/>
  10. <input type="password" id="userpwd" name="userpwd"/>
  11. <!--id就是节点的身份证号码,不能重复。-->
  12. <!--
  13. <input type="text" id="username" />
  14. -->
  15. </form>
  16. </body>
  17. </html>

 

谷歌浏览器:这也没啥展示的啊,看看笔记得了。      φ(゜▽゜*)?

 

2、HTML中的div和span:

笔记:

1、div和span是什么?有什么用?

            * div和span都可以称为“图层”
            * 图层的作用是为了保证页面可以灵活的布局。
            * 图层就是一个一个的盒子,div嵌套div就是盒子套盒子。
            * div和span是可以定位的,只要定下div的左上角的x轴和y轴坐标即可。


2、其实最早的网页是采用table进行布局的,但是table不灵活,太死板。
            现代的网页开发中div布局使用最多,几乎很少使用table进行布局了。
            
3、div和span的区别?
                div独自占用一行(默认情况下)
                span不会独自占用一行。

代码:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>HTML中的div和span</title>
  6. </head>
  7. <body>
  8. <div id="div1">我是一个DIV</div>
  9. <div id="div2">我是一个DIV</div>
  10. <span id="span1">我是一个SPAN标签</span>
  11. <span id="span2">我是一个SPAN标签</span>
  12. <div id="div3">
  13. <div>
  14. <div>test</div>
  15. </div>
  16. </div>
  17. </body>
  18. </html>

 

谷歌浏览器:

 

原文链接:http://www.cnblogs.com/Burning-youth/p/15806001.html

 友情链接:直通硅谷  点职佳  北美留学生论坛

本站QQ群:前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

W3xue 的所有内容仅供测试,对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接(目前9元/月)请联系QQ:27243702 沸活量
皖ICP备17017327号-2 皖公网安备34020702000426号