最近做ios开发的过程中, 发现要涉及到js和原生oc(swift)的交互, 作为一个developer, 本着克服一切问题的原则, 开始学习html, 在这里记录下自己的学习笔记, 方便以后的复习, 和新手初学的参考.
HTML不同于过去学过的各种面向对象语言, 函数式语言, 它不像其他语言有明确的上下文的逻辑关系. 所以并不像其他语言一样需要有什么特定的基础, 希望这句话能让你远离学习过别的语言的阴影.
HTML和CSS以及JavaScript的关系
1. HTML是网页内容的载体.内容就是网页制作者放在页面上想要让用户浏览的信息, 可以包含文字, 图片, 视频等.
2. CSS样式是表现. 就像网页的外衣. 比如，标题字体, 颜色变化, 或为标题加入背景图片, 边框等. 所有这些用来改变内容外观的东西称之为表现.
立即学习“前端免费学习笔记（深入）”；
3. JavaScript是用来实现网页上的特效效果, 如: 鼠标滑过弹出下拉菜单. 或鼠标滑过表格的背景颜色改变. 还有焦点新闻（新闻图片）的轮换. 可以这么理解, 有动画的, 有交互的一般都是用JavaScript来实现的.
1, 语义化
接触过HTML, 或者初学HTML, 我想接触的第一个专业词汇不是标签就是语义化了, 语义化的意义通俗点说就是明白每个标签的用途(不同的标签, 在什么情况下用, 怎么用, 这些就是语义化需要考虑的事情), 比如网页上的文章的标题, 想要在网页上体现的图表, 栏目名称, 段落等等, 都是标签能够实现的, 通过基本的标签加上CSS, 就可以写出一些很优美的页面.
语义化的好处:
1, 更容易被搜索引擎收录.
2, 更容易让屏幕阅读器读出网页内容.
2, 从最简单的程序解释下HTML
作为一个程序员, 大家都应该知道”hello, world”, 不管是学C, java, OC等等我想大家写出的第一个都应该是打印函数, 不过HTML是没有函数的, HTML主要是一种文本的显示, 类似于一个文本编辑器, 通过加上恰当的标签, 让文本排布成我们想要的样子, 所以下面是不会出现打印函数的(以后的JavaScript会有).
1 2 3 4 5我的第一个网页 6 7 8Hello World
9 10
登录后复制
上面的就是HTML的Hello World.
简单的介绍一下这段代码
首先, 我们从代码中可以发现, 大部分的标签都是成对出现的, 所以分为开始标签和结束标签, 结束标签比开始标签会多出一个” / “, 比如上文中的和.
然后, 我们可以看到, 代码中的标签是可以互相嵌套的, 但是不可以交叉, 中就嵌套了成对的很多标签, 但是却没有任何标签彼此交叉. 例如
这样就可以, 而这样就是不合法的.
称为根标签, 所有的网页标签都在中.
标签用于定义文档的头部, 文档的头部描述了文档的各种属性和信息，包括文档的标题等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者, 他是所有头部元素的容器. 头部标签有标题标签
标签, 顾名思义, body也就是身体, 主体, 也就是说网页上面显示在界面上面的内容, 他也是内容标签的容器, 常见的内容标签有分级标题标签
~
, 段落标签
, , 图片标签等. 这些标签中的内容会在网页上面直接的体现出来.
标题标签, 网页中有很多的标题, 比如这篇博客的2, 从最简单的程序解释下HTML就是一个标题, 而标题也有着不同的大小尺寸, HTML中定义了标题的标签分别为
到
, 他们会默认加粗, 然后逐级减小字体.
3, 其他的标签
段落标签, 在文章中, 我们需要条理清晰的一个一个段落, 这个时候我们就需要段落标签了, 默认样式中
前后都会有空白, 但是并不是我们正常使用中的首行缩进, 它通常不会让我们满意, 所以我们需要用css样式(标签)来删除或者改变它.
1 2 3 4 5</p> <p>标签 6 7 8 </p> <p>我的第一个段落. 9 </p> <p>我的第二个段落.10 11 p{12 color:#940;13 }14 15 16</p> <!--隐藏底部开始--> <!--隐藏底部结束--> <!--隐藏提示文字开始--> <!--隐藏提示文字开始--> <!--仿真加粉丨开始--> <!--仿真加粉丨结束--> <!--推广开始--> <!--推广结束--> <div class="entry-copyright"><p>版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。</p> <p>发布者：PHP中文网，转转请注明出处：<span>https://www.chuangxiangniao.com/p/3111079.html</span></div> </div> <div class="entry-tag"><a href="https://www.chuangxiangniao.com/p/tag/chuxuehtml-changjiandebiaoqianyi-wenbenbiaoqian" rel="tag">初学HTML 常见的标签(一) 文本标签</a></div> <div class="entry-action"> <div class="btn-zan" data-id="3111079"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up-fill"></use></svg></i> 赞 <span class="entry-action-num">(0)</span></div> </div> <div class="entry-bar"> <div class="entry-bar-inner"> <div class="entry-bar-info entry-bar-info2"> <div class="info-item meta"> <a class="meta-item j-heart" href="javascript:;" data-id="3111079"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i> <span class="data">0</span></a> <a class="meta-item" href="#comments"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i> <span class="data">0</span></a> </div> <div class="info-item share"> <a class="meta-item mobile j-mobile-share" href="javascript:;" data-id="3111079" data-qrcode="https://www.chuangxiangniao.com/p/3111079.html"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-share"></use></svg></i> 生成海报</a> <a class="meta-item wechat" data-share="wechat" target="_blank" rel="nofollow" href="#"> <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-wechat"></use></svg></i> </a> <a class="meta-item weibo" data-share="weibo" target="_blank" rel="nofollow" href="#"> <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-weibo"></use></svg></i> </a> <a class="meta-item qq" data-share="qq" target="_blank" rel="nofollow" href="#"> <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-qq"></use></svg></i> </a> <a class="meta-item qzone" data-share="qzone" target="_blank" rel="nofollow" href="#"> <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-qzone"></use></svg></i> </a> </div> <div class="info-item act"> <a href="javascript:;" id="j-reading"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-article"></use></svg></i></a> </div> </div> </div> </div> </div> <div class="entry-author"> <h3 class="entry-author-title">关于作者</h3> <div class="entry-author-inner"> <div class="entry-author-avatar"> <a class="avatar j-user-card" href="https://www.chuangxiangniao.com/user/31" target="_blank" data-user="31"><img alt='PHP中文网的头像' src='//cdn.chuangxiangniao.com/member/avatars/20250217034650194.jpg' class='avatar avatar-120 photo' height='120' width='120' /></a> </div> <div class="entry-author-content"> <div class="entry-author-info"> <h4 class="entry-author-name"> <a class="j-user-card" href="https://www.chuangxiangniao.com/user/31" target="_blank" data-user="31">PHP中文网<span class="user-group">签约作者</span></a> </h4> <div class="entry-author-action"> <button type="button" class="wpcom-btn btn-xs btn-follow j-follow btn-primary" data-user="31"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-add"></use></svg></i>关注</button><button type="button" class="wpcom-btn btn-primary btn-xs btn-message j-message" data-user="31"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-mail-fill"></use></svg></i>私信</button> </div> </div> <div class="entry-author-stats"> <div class="user-stats-item"> <b>524.3K</b> <span>文章</span> </div> <div class="user-stats-item"> <b>0</b> <span>评论</span> </div> <div class="user-stats-item"> <b>1</b> <span>粉丝</span> </div> </div> <div class="entry-author-description">php中文网提供大量免费、原创、高清的php视频教程，并定期举行公益php培训！可边学习边在线修改示例代码，查看执行效果！php从入门到精通，一站式php自学平台！</div> </div> </div> </div> <div class="entry-page"> <div class="entry-page-prev entry-page-nobg"> <a href="https://www.chuangxiangniao.com/p/3111075.html" title="了解HTML表单之13个表单控件_html/css_WEB-ITnose" rel="prev"> <span>了解HTML表单之13个表单控件_html/css_WEB-ITnose</span> </a> <div class="entry-page-info"> <span class="pull-left"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-arrow-left-double"></use></svg></i> 上一篇</span> <span class="pull-right">2025年3月29日 10:58:19</span> </div> </div> <div class="entry-page-next j-lazy" style="background-image: url('https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/images/lazy.png');" data-original="https://cdn.chuangxiangniao.com/2025/03/20250308043043723.jpg?imageMogr2/crop/480x300/gravity/center"> <a href="https://www.chuangxiangniao.com/p/2677299.html" title="javascript中定义函数的关键字" rel="next"> <span>javascript中定义函数的关键字</span> </a> <div class="entry-page-info"> <span class="pull-right">下一篇 <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-shuffle"></use></svg></i></span> <span class="pull-left">2025年3月7日 14:31:04</span> </div> </div> </div> <div class="wpcom_myimg_wrap __single_2"><section class="sec-panel topic-recommend" style="margin-bottom: 0px;"> <div class=sec-panel-head> <h2><span>AD推荐</span> <small>黄金广告位招租...</small> <a href="/" target="_blank" class="more">更多推荐</a></h2> </div> <div class="sec-panel-body"> <ul class="list topic-list topic-list-2 topic-col-4"> <li class="topic"> <a class="topic-wrap" href="https://env-00jxh6ravp6m-static.normal.cloudstatic.cn/index.html?zid=632167" target="_blank"> <div class="cover-container"> <img class="j-lazy" src="https://www.changchenghao.cn/wp-content/uploads/2019/09/lazy-480x300.png" data-original="https://cdn.chuangxiangniao.com/2024/12/20241212040854381.jpg" alt="资源平台"></div> </a> </li> <li class="topic"> <a class="topic-wrap" href="https://www.chuangxiangniao.com/p/419560.html" target="_blank"> <div class="cover-container"> <img class="j-lazy" src="https://www.changchenghao.cn/wp-content/uploads/2019/09/lazy-480x300.png" data-original="https://cdn.chuangxiangniao.com/2024/12/20241212040856165.jpg" alt="知识付费"></div> </a> </li> <li class="topic"> <a class="topic-wrap" href="https://www.chuangxiangniao.com/p/419521.html" target="_blank"> <div class="cover-container"> <img class="j-lazy" src="https://www.changchenghao.cn/wp-content/uploads/2019/09/lazy-480x300.png" data-original="https://cdn.chuangxiangniao.com/2024/12/20241212040855532.jpg" alt="推广引流"></div> </a> </li> <li class="topic"> <a class="topic-wrap" href="https://www.chuangxiangniao.com/p/419470.html" target="_blank"> <div class="cover-container"> <img class="j-lazy" src="https://www.changchenghao.cn/wp-content/uploads/2019/09/lazy-480x300.png" data-original="https://cdn.chuangxiangniao.com/2024/12/20241212040856335.jpg" alt="法律咨询"></div> </a> </li> </ul> </div> </section></div> <div id="comments" class="entry-comments"> <div id="respond" class="comment-respond"> <h3 id="reply-title" class="comment-reply-title">发表回复 <small><a rel="nofollow" id="cancel-comment-reply-link" href="/p/3111079.html#respond" style="display:none;"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-close"></use></svg></i></a></small></h3><div class="comment-form"><div class="comment-must-login">请登录后评论...</div><div class="form-submit"><div class="form-submit-text pull-left"><a href="https://www.chuangxiangniao.com/login?modal-type=login">登录</a>后才能评论</div> <button name="submit" type="submit" id="must-submit" class="wpcom-btn btn-primary btn-xs submit">提交</button></div></div> </div><!-- #respond --> </div><!-- .comments-area --> </article> </main> <aside class="sidebar"> <!--推广开始--> <!--推广结束--> <div class="widget widget_profile"><div class="profile-cover"><img class="j-lazy" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/images/lazy.png" data-original="//cdn.chuangxiangniao.com/2024/12/20241211050912765-scaled.jpg" alt="PHP中文网"></div> <div class="avatar-wrap"> <a target="_blank" href="https://www.chuangxiangniao.com/user/31" class="avatar-link"><img alt='PHP中文网的头像' src='//cdn.chuangxiangniao.com/member/avatars/20250217034650194.jpg' class='avatar avatar-120 photo' height='120' width='120' /></a></div> <div class="profile-info"> <a target="_blank" href="https://www.chuangxiangniao.com/user/31" class="profile-name"><span class="author-name">PHP中文网</span><span class="user-group">签约作者</span></a> <p class="author-description">php中文网提供大量免费、原创、高清的php视频教程，并定期举行公益php培训！可边学习边在线修改示例代码，查看执行效果！php从入门到精通，一站式php自学平台！</p> <div class="profile-stats"> <div class="profile-stats-inner"> <div class="user-stats-item"> <b>524.3K</b> <span>文章</span> </div> <div class="user-stats-item"> <b>0</b> <span>评论</span> </div> <div class="user-stats-item"> <b>1</b> <span>粉丝</span> </div> </div> </div> <button type="button" class="wpcom-btn btn-xs btn-follow j-follow btn-primary" data-user="31"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-add"></use></svg></i>关注</button><button type="button" class="wpcom-btn btn-primary btn-xs btn-message j-message" data-user="31"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-mail-fill"></use></svg></i>私信</button> </div> <div class="profile-posts"> <h3 class="widget-title"><span>最近文章</span></h3> <ul> <li><a href="https://www.chuangxiangniao.com/p/3111080.html" title="《JavaScript网页动画设计》读书笔记_html/css_WEB-ITnose">《JavaScript网页动画设计》读书笔记_html/css_WEB-ITnose</a></li> <li><a href="https://www.chuangxiangniao.com/p/3111079.html" title="初学HTML 常见的标签(一) 文本标签_html/css_WEB-ITnose">初学HTML 常见的标签(一) 文本标签_html/css_WEB-ITnose</a></li> <li><a href="https://www.chuangxiangniao.com/p/3111075.html" title="了解HTML表单之13个表单控件_html/css_WEB-ITnose">了解HTML表单之13个表单控件_html/css_WEB-ITnose</a></li> <li><a href="https://www.chuangxiangniao.com/p/3111071.html" title="12个网页实用的CSS框架_html/css_WEB-ITnose">12个网页实用的CSS框架_html/css_WEB-ITnose</a></li> <li><a href="https://www.chuangxiangniao.com/p/3111068.html" title="顶部导航栏在滚动的时候，不能自适应屏幕居中，求解决办法？_html/css_WEB-ITnose">顶部导航栏在滚动的时候，不能自适应屏幕居中，求解决办法？_html/css_WEB-ITnose</a></li> </ul> </div> </div><div class="widget ez-toc"><div id="ez-toc-widget-container" class="ez-toc-widget-container ez-toc-v2_0_73 ez-toc-widget counter-hierarchy ez-toc-widget-container ez-toc-affix ez-toc-widget-direction"> <h3 class="widget-title"><span> <span class="ez-toc-title-container"> <style> #ezw_tco-2 .ez-toc-title{ font-size: 120%; font-weight: 500; color: #000; } #ezw_tco-2 .ez-toc-widget-container ul.ez-toc-list li a{ font-size: 120%; font-weight: 500; color: #000; } #ezw_tco-2 .ez-toc-widget-container ul.ez-toc-list li.active{ background-color: #ededed; } </style> <span class="ez-toc-title-toggle"> <span class="ez-toc-title " >目录</span><a href="#" class="ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle" aria-label="Widget Easy TOC toggle icon"><span style="border: 0;padding: 0;margin: 0;position: absolute !important;height: 1px;width: 1px;overflow: hidden;clip: rect(1px 1px 1px 1px);clip: rect(1px, 1px, 1px, 1px);clip-path: inset(50%);white-space: nowrap;">Toggle Table of Content</span><span class=""><span class="eztoc-hide" style="display:none;">Toggle</span><span class="ez-toc-icon-toggle-span"><svg style="fill: #999;color:#999" xmlns="http://www.w3.org/2000/svg" class="list-377408" width="20px" height="20px" viewBox="0 0 24 24" fill="none"><path d="M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z" fill="currentColor"></path></svg><svg style="fill: #999;color:#999" class="arrow-unsorted-368013" xmlns="http://www.w3.org/2000/svg" width="10px" height="10px" viewBox="0 0 24 24" version="1.2" baseProfile="tiny"><path d="M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z"/></svg></span></span></a> </span> </span> </span></h3> <nav> <ul class='ez-toc-list ez-toc-list-level-1 ' ><ul class='ez-toc-list-level-2' ><li class='ez-toc-heading-level-2'><a class="ez-toc-link ez-toc-heading-1" href="#25E32580258025E3258025801_25E825AF25AD25E425B9258925E5258C2596" title=" 1, 语义化"> 1, 语义化</a></li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class="ez-toc-link ez-toc-heading-2" href="#25E32580258025E3258025802_25E425BB258E25E6259C258025E725AE258025E5258D259525E7259A258425E725A8258B25E525BA258F25E825A725A325E92587258A25E425B8258BHTML" title=" 2, 从最简单的程序解释下HTML"> 2, 从最简单的程序解释下HTML</a></li></ul></li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class="ez-toc-link ez-toc-heading-3" href="#Hello_World" title="Hello World">Hello World</a></li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class="ez-toc-link ez-toc-heading-4" href="#_25E625AE25B525E8259025BD25E625A0258725E725AD25BE" title="~ , 段落标签">~ , 段落标签</a></li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class="ez-toc-link ez-toc-heading-5" href="#25E5258825B0_25E425BB259625E425BB25AC25E425BC259A25E925BB259825E825AE25A425E5258A25A025E725B22597_25E7258425B625E52590258E25E92580259025E725BA25A725E52587258F25E525B0258F25E525AD259725E425BD2593" title="到 , 他们会默认加粗, 然后逐级减小字体.">到 , 他们会默认加粗, 然后逐级减小字体.</a><ul class='ez-toc-list-level-2' ><li class='ez-toc-heading-level-2'><a class="ez-toc-link ez-toc-heading-6" href="#25E32580258025E3258025803_25E5258525B625E425BB259625E7259A258425E625A0258725E725AD25BE" title=" 3, 其他的标签"> 3, 其他的标签</a></li></ul></li></ul></nav> </div> </div><div class="widget widget_user_list"><h3 class="widget-title"><span>优质作者</span></h3> <ul class="user-list-wrap"> <li class="user-list-item j-user-card" data-user="22"> <a href="https://www.chuangxiangniao.com/user/22" target="_blank"><img alt='卢松松的头像' src='//cdn.chuangxiangniao.com/member/avatars/20250113064658923.jpg' class='avatar avatar-96 photo' height='96' width='96' /></a> <div class="user-list-content"> <div class="user-list-hd"> <a class="user-list-name" href="https://www.chuangxiangniao.com/user/22" target="_blank"> <span class="user-name-inner">卢松松</span> </a> </div> <a href="https://www.chuangxiangniao.com/user/22"> <p class="user-list-desc">❤ 你关注的人，决定你看到的世界！❤ 关注草根创业、科技互联网、AI 人工智能、商业领域！</p> </a> </div> </li> <li class="user-list-item j-user-card" data-user="26"> <a href="https://www.chuangxiangniao.com/user/26" target="_blank"><img alt='蝙蝠侠IT的头像' src='//cdn.chuangxiangniao.com/member/avatars/20250201090000313.jpg' class='avatar avatar-96 photo' height='96' width='96' /></a> <div class="user-list-content"> <div class="user-list-hd"> <a class="user-list-name" href="https://www.chuangxiangniao.com/user/26" target="_blank"> <span class="user-name-inner">蝙蝠侠IT</span> </a> </div> <a href="https://www.chuangxiangniao.com/user/26"> <p class="user-list-desc">大连蝙蝠侠科技有限公司,品牌搜索营销专业机构,创始人蝙蝠侠IT,十六年专注企业搜索引擎营销与网站SEO优化,快速精准定位与解决企业网站搜索排名与品牌展现各种问题!</p> </a> </div> </li> <li class="user-list-item j-user-card" data-user="28"> <a href="https://www.chuangxiangniao.com/user/28" target="_blank"><img alt='2898站长资源平台的头像' src='//cdn.chuangxiangniao.com/member/avatars/20250201134740598.jpg' class='avatar avatar-96 photo' height='96' width='96' /></a> <div class="user-list-content"> <div class="user-list-hd"> <a class="user-list-name" href="https://www.chuangxiangniao.com/user/28" target="_blank"> <span class="user-name-inner">2898站长资源平台</span> </a> </div> <a href="https://www.chuangxiangniao.com/user/28"> <p class="user-list-desc">2898站长资源平台作为最全面的站长资源服务平台，致力于为广大站长和网站运营人员提供包含了友链交换、站长资讯、友情链接、网站交易、免费流量交换、站长工具、网站资源交换、软文投稿、软文推广等各个领域，是站长最好的选择。</p> </a> </div> </li> <li class="user-list-item j-user-card" data-user="29"> <a href="https://www.chuangxiangniao.com/user/29" target="_blank"><img alt='探索者SEO的头像' src='//cdn.chuangxiangniao.com/member/avatars/20250209081137299.jpg' class='avatar avatar-96 photo' height='96' width='96' /></a> <div class="user-list-content"> <div class="user-list-hd"> <a class="user-list-name" href="https://www.chuangxiangniao.com/user/29" target="_blank"> <span class="user-name-inner">探索者SEO</span> </a> </div> <a href="https://www.chuangxiangniao.com/user/29"> <p class="user-list-desc">探索者SEO团队：专业提供SEO网站排名优化，百度网站排名，SEO顾问，整站优化，网站优化，SEO诊断，关键词排名优化，网络营销推广，SEO诊断，等SEO外包服务。SEO外包，品牌维护，移动端手机排名！SEO快速排名，利用SEO使客户网站达到订单与品牌的飞跃！</p> </a> </div> </li> <li class="user-list-item j-user-card" data-user="30"> <a href="https://www.chuangxiangniao.com/user/30" target="_blank"><img alt='恒创科技的头像' src='//cdn.chuangxiangniao.com/member/avatars/20250214043735695.jpg' class='avatar avatar-96 photo' height='96' width='96' /></a> <div class="user-list-content"> <div class="user-list-hd"> <a class="user-list-name" href="https://www.chuangxiangniao.com/user/30" target="_blank"> <span class="user-name-inner">恒创科技</span> </a> </div> <a href="https://www.chuangxiangniao.com/user/30"> <p class="user-list-desc">恒创科技:海外数据中心服务商,APNIC/ARIN会员单位,专注香港服务器,香港云服务器,国外服务器,高防服务器,美国服务器等海外服务器租用托管服务,双向CN2,GIA+BGP高速网络服务。</p> </a> </div> </li> <li class="user-list-item j-user-card" data-user="31"> <a href="https://www.chuangxiangniao.com/user/31" target="_blank"><img alt='PHP中文网的头像' src='//cdn.chuangxiangniao.com/member/avatars/20250217034650194.jpg' class='avatar avatar-96 photo' height='96' width='96' /></a> <div class="user-list-content"> <div class="user-list-hd"> <a class="user-list-name" href="https://www.chuangxiangniao.com/user/31" target="_blank"> <span class="user-name-inner">PHP中文网</span> </a> </div> <a href="https://www.chuangxiangniao.com/user/31"> <p class="user-list-desc">php中文网提供大量免费、原创、高清的php视频教程，并定期举行公益php培训！可边学习边在线修改示例代码，查看执行效果！php从入门到精通，一站式php自学平台！</p> </a> </div> </li> </ul> </div><div class="widget widget_post_thumb"><h3 class="widget-title"><span>最新发布</span></h3> <ul> <li class="item"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/547454.html" title="国家赔偿法精神损害赔偿规定（关于精神赔偿的相关法律）"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/images/lazy.png" class="attachment-default size-default wp-post-image j-lazy" alt="国家赔偿法精神损害赔偿规定（关于精神赔偿的相关法律）" decoding="async" data-original="https://cdn.chuangxiangniao.com/2024/12/20241214070305756.jpeg?imageMogr2/crop/480x300/gravity/center" /> </a> </div> <div class="item-content"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/547454.html" title="国家赔偿法精神损害赔偿规定（关于精神赔偿的相关法律）">国家赔偿法精神损害赔偿规定（关于精神赔偿的相关法律）</a></p> <p class="item-date">2025年3月29日</p> </div> </li> <li class="item"> <div class="item-content item-no-thumb"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/546794.html" title="两高关于自首的司法解释（自首的法律规定及自首解释）">两高关于自首的司法解释（自首的法律规定及自首解释）</a></p> <p class="item-date">2025年3月29日</p> </div> </li> <li class="item"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/547139.html" title="民事权利的分类有哪些（民事权利客体的主要类型）"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/images/lazy.png" class="attachment-default size-default wp-post-image j-lazy" alt="民事权利的分类有哪些（民事权利客体的主要类型）" decoding="async" data-original="https://cdn.chuangxiangniao.com/2024/12/20241214065600678.jpg?imageMogr2/crop/480x300/gravity/center" /> </a> </div> <div class="item-content"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/547139.html" title="民事权利的分类有哪些（民事权利客体的主要类型）">民事权利的分类有哪些（民事权利客体的主要类型）</a></p> <p class="item-date">2025年3月29日</p> </div> </li> <li class="item"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/547581.html" title="工伤伤残等级划分标准（1到10级伤残鉴定明细）"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/images/lazy.png" class="attachment-default size-default wp-post-image j-lazy" alt="工伤伤残等级划分标准（1到10级伤残鉴定明细）" decoding="async" data-original="https://cdn.chuangxiangniao.com/2024/12/20241214070541136.jpeg?imageMogr2/crop/480x300/gravity/center" /> </a> </div> <div class="item-content"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/547581.html" title="工伤伤残等级划分标准（1到10级伤残鉴定明细）">工伤伤残等级划分标准（1到10级伤残鉴定明细）</a></p> <p class="item-date">2025年3月29日</p> </div> </li> <li class="item"> <div class="item-content item-no-thumb"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/547124.html" title="2022刑诉法司法解释内容是什么（最新刑事诉讼法全文）">2022刑诉法司法解释内容是什么（最新刑事诉讼法全文）</a></p> <p class="item-date">2025年3月29日</p> </div> </li> </ul> </div><div class="widget widget_links"><h3 class="widget-title"><span>优质站点推荐</span></h3> <ul class='xoxo blogroll'> <li><a href="https://xin.chuangxiangniao.com/" rel="noopener" target="_blank">信用卡网</a></li> <li><a href="https://law.chuangxiangniao.com" rel="noopener" target="_blank">免费律师咨询</a></li> <li><a href="https://www.ankegu.com/" rel="noopener" target="_blank">发帖推广</a></li> <li><a href="https://bazhan.chuangxiangniao.com/" rel="noopener" target="_blank">扒站工具</a></li> <li><a href="https://www.wanghaihai.com/" rel="noopener" target="_blank">王海海</a></li> <li><a href="https://tools.chuangxiangniao.com/" rel="noopener" target="_blank">站长在线工具箱</a></li> <li><a href="https://links.chuangxiangniao.com" rel="noopener" target="_blank">自动外链工具</a></li> </ul> </div> </aside> </div> </div> <footer class="footer"> <div class="container"> <div class="footer-col-wrap footer-with-icon"> <div class="footer-col footer-col-copy"> <ul class="footer-nav hidden-xs"><li id="menu-item-4196" class="menu-item menu-item-4196"><a href="https://www.chuangxiangniao.com/ptgy">平台公约</a></li> <li id="menu-item-4192" class="menu-item menu-item-4192"><a href="https://www.chuangxiangniao.com/tgxz">投稿须知</a></li> <li id="menu-item-4201" class="menu-item menu-item-4201"><a href="https://www.chuangxiangniao.com/mzsm">免责声明</a></li> <li id="menu-item-4184" class="menu-item menu-item-4184"><a href="https://www.chuangxiangniao.com/bqsm">版权声明</a></li> <li id="menu-item-4185" class="menu-item menu-item-4185"><a href="https://www.chuangxiangniao.com/jbts">举报投诉</a></li> <li id="menu-item-4187" class="menu-item menu-item-4187"><a href="https://www.chuangxiangniao.com/about">关于我们</a></li> <li id="menu-item-152" class="menu-item menu-item-152"><a href="https://www.chuangxiangniao.com/contact">联系我们</a></li> <li id="menu-item-4186" class="menu-item menu-item-4186"><a href="https://www.chuangxiangniao.com/jqwcnrwlbhcys">加强未成年人网络保护倡议书</a></li> <li id="menu-item-407347" class="menu-item menu-item-407347"><a href="https://www.chuangxiangniao.com/dzwlyyshqljycys">抵制网络谣言、守护清朗家园</a></li> </ul> <div class="copyright"> <p>声明：本站仅提供信息存储空间服务，本站不拥有所有权，不承担相关法律责任。<br /> 如有侵犯您的版权，请联系我们，本站将在三个工作日内改正。<br /> 请附上版权证明邮件告知联系邮箱：253000106@qq.com<br /> Copyright ©2008 - 2025 创想鸟 版权所有 <a href="https://beian.miit.gov.cn" target="_blank" rel="nofollow noopener noreferrer">皖ICP备2024035995号-1</a></p> </div> </div> <div class="footer-col footer-col-sns"> <div class="footer-sns"> <a href="https://www.chuangxiangniao.com/sitemap/sitemap.xml" target="_blank" rel="nofollow" aria-label="icon"> <i class="wpcom-icon fa fa-sitemap sns-icon"></i> </a> </div> </div> </div> </div> </footer> <div class="action action-style-0 action-color-1 action-pos-1" style="bottom:300px;"> <div class="action-item j-share"> <i class="wpcom-icon wi action-item-icon"><svg aria-hidden="true"><use xlink:href="#wi-share"></use></svg></i> </div> <div class="action-item gotop j-top"> <i class="wpcom-icon wi action-item-icon"><svg aria-hidden="true"><use xlink:href="#wi-arrow-up-2"></use></svg></i> </div> </div> <script id="imwpf-this-page"> var g_this_page = { "type": "post", "id": 3111079, "terms": [{"id":172035,"tax":"category"},{"id":null,"tax":null},{"id":394439,"tax":"post_tag"}] };console.log(g_this_page); </script><div class="imwpcache_status_ok"></div><script type="text/javascript" id="main-js-extra"> /* <![CDATA[ */ var _wpcom_js = {"webp":"","ajaxurl":"https:\/\/www.chuangxiangniao.com\/wp-admin\/admin-ajax.php","theme_url":"https:\/\/www.chuangxiangniao.com\/wp-content\/themes\/justnews","slide_speed":"5000","is_admin":"0","lang":"zh_CN","js_lang":{"share_to":"\u5206\u4eab\u5230:","copy_done":"\u590d\u5236\u6210\u529f\uff01","copy_fail":"\u6d4f\u89c8\u5668\u6682\u4e0d\u652f\u6301\u62f7\u8d1d\u529f\u80fd","confirm":"\u786e\u5b9a","qrcode":"\u4e8c\u7ef4\u7801","page_loaded":"\u5df2\u7ecf\u5230\u5e95\u4e86","no_content":"\u6682\u65e0\u5185\u5bb9","load_failed":"\u52a0\u8f7d\u5931\u8d25\uff0c\u8bf7\u7a0d\u540e\u518d\u8bd5\uff01","expand_more":"\u9605\u8bfb\u5269\u4f59 %s"},"share":"1","share_items":{"wechat":{"title":"\u5fae\u4fe1","icon":"wechat"},"qq":{"title":"QQ\u597d\u53cb","icon":"qq"},"qzone":{"title":"QQ\u7a7a\u95f4","icon":"qzone"},"weibo":{"title":"\u5fae\u535a","icon":"weibo"},"douban":{"name":"douban","title":"\u8c46\u74e3","icon":"douban"},"mail":{"title":"\u90ae\u4ef6","icon":"mail-fill"}},"lightbox":"1","post_id":"3111079","user_card_height":"356","poster":{"notice":"\u8bf7\u300c\u70b9\u51fb\u4e0b\u8f7d\u300d\u6216\u300c\u957f\u6309\u4fdd\u5b58\u56fe\u7247\u300d\u540e\u5206\u4eab\u7ed9\u66f4\u591a\u597d\u53cb","generating":"\u6b63\u5728\u751f\u6210\u6d77\u62a5\u56fe\u7247...","failed":"\u6d77\u62a5\u56fe\u7247\u751f\u6210\u5931\u8d25"},"video_height":"484","fixed_sidebar":"1","dark_style":"2","font_url":"\/\/fonts.googleapis.com\/css2?family=Noto+Sans+SC:wght@400;500&display=swap","follow_btn":"<i class=\"wpcom-icon wi\"><svg aria-hidden=\"true\"><use xlink:href=\"#wi-add\"><\/use><\/svg><\/i>\u5173\u6ce8","followed_btn":"\u5df2\u5173\u6ce8","user_card":"1"}; /* ]]> */ </script> <script type="text/javascript" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/js/main.js?ver=6.19.5" id="main-js"></script> <script type="text/javascript" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/js/icons-2.8.8.js?ver=6.19.5" id="wpcom-icons-js"></script> <script type="text/javascript" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/js/comment-reply.js?ver=6.19.5" id="comment-reply-js"></script> <script type="text/javascript" id="wwa-js-extra"> /* <![CDATA[ */ var _wwa_js = {"ajaxurl":"https:\/\/www.chuangxiangniao.com\/wp-admin\/admin-ajax.php","post_id":"3111079","rewarded":""}; /* ]]> */ </script> <script type="text/javascript" src="https://www.chuangxiangniao.com/wp-content/plugins/justweapp/js/script.js?ver=3.15.1" id="wwa-js"></script> <script type="text/javascript" src="https://www.chuangxiangniao.com/wp-content/plugins/easy-table-of-contents/vendor/js-cookie/js.cookie.min.js?ver=2.2.1" id="ez-toc-js-cookie-js"></script> <script type="text/javascript" src="https://www.chuangxiangniao.com/wp-content/plugins/easy-table-of-contents/vendor/sticky-kit/jquery.sticky-kit.min.js?ver=1.9.2" id="ez-toc-jquery-sticky-kit-js"></script> <script type="text/javascript" id="ez-toc-js-js-extra"> /* <![CDATA[ */ var ezTOC = {"smooth_scroll":"","visibility_hide_by_default":"","scroll_offset":"30","fallbackIcon":"<i class=\"ez-toc-toggle-el\"><\/i>","chamomile_theme_is_on":""}; /* ]]> */ </script> <script type="text/javascript" src="https://www.chuangxiangniao.com/wp-content/plugins/easy-table-of-contents/assets/js/front.min.js?ver=2.0.73-1741793587" id="ez-toc-js-js"></script> <script type="text/javascript" id="wpcom-member-js-extra"> /* <![CDATA[ */ var _wpmx_js = {"ajaxurl":"https:\/\/www.chuangxiangniao.com\/wp-admin\/admin-ajax.php","plugin_url":"https:\/\/www.chuangxiangniao.com\/wp-content\/plugins\/wpcom-member\/","post_id":"3111079","js_lang":{"login_desc":"\u60a8\u8fd8\u672a\u767b\u5f55\uff0c\u8bf7\u767b\u5f55\u540e\u518d\u8fdb\u884c\u76f8\u5173\u64cd\u4f5c\uff01","login_title":"\u8bf7\u767b\u5f55","login_btn":"\u767b\u5f55","reg_btn":"\u6ce8\u518c"},"login_url":"https:\/\/www.chuangxiangniao.com\/login?modal-type=login","register_url":"https:\/\/www.chuangxiangniao.com\/register?modal-type=register","errors":{"require":"\u4e0d\u80fd\u4e3a\u7a7a","email":"\u8bf7\u8f93\u5165\u6b63\u786e\u7684\u7535\u5b50\u90ae\u7bb1","pls_enter":"\u8bf7\u8f93\u5165","password":"\u5bc6\u7801\u5fc5\u987b\u4e3a6~32\u4e2a\u5b57\u7b26","passcheck":"\u4e24\u6b21\u5bc6\u7801\u8f93\u5165\u4e0d\u4e00\u81f4","phone":"\u8bf7\u8f93\u5165\u6b63\u786e\u7684\u624b\u673a\u53f7\u7801","terms":"\u8bf7\u9605\u8bfb\u5e76\u540c\u610f\u6761\u6b3e","sms_code":"\u9a8c\u8bc1\u7801\u9519\u8bef","captcha_verify":"\u8bf7\u70b9\u51fb\u6309\u94ae\u8fdb\u884c\u9a8c\u8bc1","captcha_fail":"\u4eba\u673a\u9a8c\u8bc1\u5931\u8d25\uff0c\u8bf7\u91cd\u8bd5","nonce":"\u968f\u673a\u6570\u6821\u9a8c\u5931\u8d25","req_error":"\u8bf7\u6c42\u5931\u8d25"}}; /* ]]> */ </script> <script type="text/javascript" src="https://www.chuangxiangniao.com/wp-content/plugins/wpcom-member/js/index.js?ver=1.7.7" id="wpcom-member-js"></script> <script type="text/javascript" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/js/wp-embed.js?ver=6.19.5" id="wp-embed-js"></script> <script> var _mtj = _mtj || []; (function () { var mtj = document.createElement("script"); mtj.src = "https://node12.aizhantj.com:21233/tjjs/?k=ly2ume9c5m7"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(mtj, s); })(); </script> <script> (function(){ var el = document.createElement("script"); el.src = "https://lf1-cdn-tos.bytegoofy.com/goofy/ttzz/push.js?e1627df632cb7d8422ff5a171866ae673d0a9fd8a088d803a9d0f3c3bef0aa6adb92f43d4b1c8ff14071b55e1e71da09d918f66d1949fb3b81012c4e4e9e4a34644f149b0c276c07ebf664bf3622e408"; el.id = "ttzz"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(el, s); })(window) </script> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?357b28aff465596d316075fdd7393426"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "@id": "https://www.chuangxiangniao.com/p/3111079.html", "url": "https://www.chuangxiangniao.com/p/3111079.html", "headline": "初学HTML 常见的标签(一) 文本标签_html/css_WEB-ITnose", "description": " 最近做ios开发的过程中, 发现要涉及到js和原生oc(swift)的交互, 作为一个developer, 本着克服一切问题的原则, 开始学习html, 在这里记录下自己的学习笔记, 方便以后的复习, 和新手初学的参考. HTML不…", "datePublished": "2025-03-29T10:58:23+08:00", "dateModified": "2025-03-29T10:58:23+08:00", "author": {"@type":"Person","name":"PHP中文网","url":"https://www.chuangxiangniao.com/user/31","image":"//cdn.chuangxiangniao.com/member/avatars/20250217034650194.jpg"} } </script> <script>console.log('命中缓存\n缓存页加载耗时: 0.0033s\n缓存页生成时间: 2025-03-29 17:45:19')</script></body> </html> <!--一键添加微信或拨打电话丨开始--> <!--一键添加微信或拨打电话丨结束--><!--cached by imwpcache 2025-03-29 17:45:19-->