HTML相关标签
创始人
2024-06-01 03:50:19
0次
HTML相关标签
- 标签和属性
- 文件标签
- 文本标签
- 图片标签
- 列表标签
- 链接标签
- 块标签
- 语义化标签
- 表格标签
标签和属性
文件标签
-
: html文档的根标签 -
: 头标签 用于指定html文档的一些属性 引入外部资源 -
: 标题标签 </code></pre> </li><li> <pre><code><body>: 体标签 </code></pre> </li><li> <pre><code><!DOCTYPE>: html5中定义该文档是html文档 </code></pre> </li></ul> <h3>文本标签</h3> <ul><li> <pre><code>注释:<!--注释内容--> </code></pre> </li><li> <pre><code><h1> to <h6> : 标题标签 </code></pre> </li><li> <pre><code><p> : 段落标签 </code></pre> </li><li> <pre><code><br> : 换行标签 </code></pre> </li><li> <pre><code><hr> : 展示一条水平线 </code></pre> <ul><li>属性: <ul><li>color : 颜色</li><li>width : 宽度</li><li>size : 高度</li><li>align : 对齐方式 <ul><li>center : 居中</li><li>left : 左对齐</li><li>right : 左对齐</li></ul> </li></ul> </li></ul> </li><li> <pre><code><b> : 字体加粗 </code></pre> </li><li> <pre><code><i> : 字体斜体 </code></pre> </li><li> <pre><code><font> 字体标签 </code></pre> <ul><li>属性 <ul><li>color : 颜色</li><li>size : 大小</li><li>face : 字体</li></ul> </li></ul> </li><li> <pre><code><center> </code></pre> </li><li> <p>属性定义</p> <ul><li>color: <ul><li>英文单词 : red green blue …</li><li>rgb(值,1值2,值3) : 值得范围 : 0~255 如 : rgb(0,0,255_</li><li>#值1值2值3 : 值的范围 : 00~FF之间 如 : #FF00FF</li></ul> </li><li>width: <ul><li>数值 : width=“20” ,数值单位默认是px(像素)</li><li>数值%: 占比相对于父元素的比例</li></ul> </li></ul> </li></ul> <h3>图片标签</h3> <ul><li> <pre><code><img src="路径" alt="图片显示不出来时的图片名字"> </code></pre> </li><li> <p>绝对路径</p> <ul><li>以盘符开始的路径</li></ul> </li><li> <p>相对路径</p> <ul><li>相对于此html文件</li><li>./ 代表当前目录</li><li>…/ 代表上一级目录</li><li>什么都不写 相当于./</li></ul> </li></ul> <h3>列表标签</h3> <ul><li>有序列表 <ul><li>ol <ul><li>属性: type = “A” “a” “I” “i” “1”</li></ul> </li><li>li</li></ul> </li><li>无序列表 <ul><li>ul</li><li>li</li></ul> </li></ul> <h3>链接标签</h3> <ul><li>a : 定义一个超链接 <ul><li>属性: <ul><li>href :指定访问资源URL</li><li>target: 指定打开资源方式 <ul><li>_self:默认值,在当前页面打开</li><li>_blank:在空白页面打开</li></ul> </li></ul> </li></ul> </li></ul> <h3>块标签</h3> <ul><li> <pre><code><div> 每一个div占满一整行 块级标签 </code></pre> </li><li> <pre><code><span> 文本信息在一行展示 行内标签 内联标签 </code></pre> </li></ul> <h3>语义化标签</h3> <ul><li> <header>页眉 </header></li><li> <footer>页脚 </footer></li></ul> <h3>表格标签</h3> <ul><li>table 定义表格 <ul><li>width :宽度</li><li>border :边框</li><li>cellpadding :定义内容和单元格的</li><li>cellspacing :定义单元格之间的距离 如果指定为 则单元格的会合为一条</li><li>bgcolor :背景色</li><li>align :对齐方式</li></ul> </li><li>tr 定义行 <ul><li>bgcolor :背景色</li><li>align :对齐方式</li></ul> </li><li>td 定义单元格 <ul><li>colspan :合并列</li><li>rowspan :合并行</li></ul> </li><li>th 定义表头单元格</li><li> :表格标题 </li><li> :表示表格的头部分</li><li> :表示表格的体部分 </li><li> 表示表格的脚部分 </li></ul><link href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/markdown_views-0407448025.css" rel="stylesheet"><link href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/style-bb308a51ed.css" rel="stylesheet"> <!--end::Text--> </div> <!--end::Description--> <div class="mt-5"> <!--关键词搜索--> <a href="/index.php?s=news&c=search&keyword=%E8%AF%8D%E5%BA%93%E5%8A%A0%E8%BD%BD%E9%94%99%E8%AF%AF%3A%E6%9C%AA%E8%83%BD%E6%89%BE%E5%88%B0%E6%96%87%E4%BB%B6%E2%80%9CE%3A%5Chighferrum_mysql%5CConfiguration%5CDict_Stopwords.txt%E2%80%9D%E3%80%82" class="badge badge-light-primary fw-bold my-2" target="_blank">词库加载错误:未能找到文件“E:\highferrum_mysql\Configuration\Dict_Stopwords.txt”。</a> </div> <div class="mt-5"> <p class="fc-show-prev-next"> <strong>上一篇：</strong><a href="/news/17445.html">QML 模型（ListModel）</a><br> </p> <p class="fc-show-prev-next"> <strong>下一篇：</strong><a href="/news/17447.html">windows应用（vc++2022）MFC基础到实战(3)-基础（3）</a> </p> </div> <!--begin::Block--> <div class="d-flex flex-stack mb-2 mt-10"> <!--begin::Title--> <h3 class="text-dark fs-5 fw-bold text-gray-800">相关内容</h3> <!--end::Title--> </div> <div class="separator separator-dashed mb-9"></div> <!--end::Block--> <div class="row g-10"> </div> </div> <!--end::Table widget 14--> </div> <!--end::Col--> <!--begin::Col--> <div class="col-xl-4 mt-0"> <!--begin::Chart Widget 35--> <div class="card card-flush h-md-100"> <!--begin::Header--> <div class="card-header pt-5 "> <!--begin::Title--> <h3 class="card-title align-items-start flex-column"> <!--begin::Statistics--> <div class="d-flex align-items-center mb-2"> <!--begin::Currency--> <span class="fs-5 fw-bold text-gray-800 ">热门资讯</span> <!--end::Currency--> </div> <!--end::Statistics--> </h3> <!--end::Title--> </div> <!--end::Header--> <!--begin::Body--> <div class="card-body pt-3"> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/e6ccb1d0250d440.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35999.html" class="text-dark fw-bold text-hover-primary fs-6"> 变形记六年级作文（实用6篇）</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">变形记六年级作文 篇一我的变形记之旅我是一个普通的小学六年级学生，最近我读了一本引人入胜的小说《变形...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/496f0083300f131.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35998.html" class="text-dark fw-bold text-hover-primary fs-6"> 我是小农夫小学六年级记叙文（...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">我是小农夫小学六年级记叙文 篇一我是小农夫我是一个小农夫，今年上小学六年级。在我家乡的小村庄里，大家...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/e2e47a60b32b302.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35997.html" class="text-dark fw-bold text-hover-primary fs-6"> 采茶姑娘六年级作文【实用5篇...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">采茶姑娘六年级作文 篇一茶园里的孩子们我家住在一个美丽的小山村，村子周围都是茶园。每年的春天，当茶叶...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/5fa89c37b736c7f.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35996.html" class="text-dark fw-bold text-hover-primary fs-6"> 我的假期生活六年级作文【优秀...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">我的假期生活六年级作文 篇一我喜欢的假期活动假期对于学生来说，是一段宝贵的时间。在假期里，我可以尽情...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/static/assets/images/nopic.gif')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35995.html" class="text-dark fw-bold text-hover-primary fs-6"> 地球的自述六年级作文500字...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">篇一：地球的自述你好，我是地球，这是我第一次向你们自述。作为宇宙中唯一一个有生命存在的行星，我感到非...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/static/assets/images/nopic.gif')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35994.html" class="text-dark fw-bold text-hover-primary fs-6"> 泪作文600字六年级（优秀6...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">泪作文600字六年级 篇一：泪水中的勇敢泪水是我们内心的一种表达，它可以是喜悦的泪水，也可以是悲伤的...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/fd436c59ccf95ce.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35993.html" class="text-dark fw-bold text-hover-primary fs-6"> 六年级上册第一单元作文500...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">六年级上册第一单元作文500字 篇一我的暑假生活暑假到了，我迫不及待地开始了我的暑假生活。这个暑假，...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/b1f09ba8a5c10b4.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35992.html" class="text-dark fw-bold text-hover-primary fs-6"> 小动物三年级作文300字【经...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">小动物三年级作文300字 篇一我喜欢小动物我是一个小动物爱好者，我喜欢各种各样的小动物。我觉得它们都...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/4ca720189975dd3.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35990.html" class="text-dark fw-bold text-hover-primary fs-6"> 秋韵六年级作文【经典6篇】</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">秋韵六年级作文 篇一我与秋天的邂逅秋天是一个美丽的季节，它给大地披上了五彩斑斓的外衣。我喜欢秋天，因...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/86b018cb90f894e.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35991.html" class="text-dark fw-bold text-hover-primary fs-6"> 功夫不负有心人作文（优秀3篇...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">功夫不负有心人作文 篇一在人生的道路上，我们常常会遇到各种各样的困难和挑战。然而，只要我们拥有一颗有...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/64610fe6ca35835.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35988.html" class="text-dark fw-bold text-hover-primary fs-6"> 三年级作文做家务200字左右...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">三年级作文做家务200字左右 篇一帮助家人，乐在其中家务是我们生活中不可避免的一部分，也是我们孝敬父...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/24d8a775460c185.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35989.html" class="text-dark fw-bold text-hover-primary fs-6"> 三年级作文254字（精彩6篇...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">三年级作文254字 篇一最喜欢的动物我最喜欢的动物是猫。猫是一种非常可爱的动物，它们有着柔软的皮毛和...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/fbdd703a89e91b3.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35986.html" class="text-dark fw-bold text-hover-primary fs-6"> 小学三年级描写玫瑰花的作文【...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">小学三年级描写玫瑰花的作文 篇一玫瑰花是我最喜欢的花之一。它是世界上最美丽的花朵之一，被誉为“花中皇...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/cdd6ae579cac6d2.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35987.html" class="text-dark fw-bold text-hover-primary fs-6"> 三年级暑假作文：夏夜（经典6...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">三年级暑假作文：夏夜 篇一夏夜的星空夏夜的星空美得像一幅画。当太阳落下地平线，天空渐渐暗下来的时候，...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/fd548df46beb6ac.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35985.html" class="text-dark fw-bold text-hover-primary fs-6"> 三年级作文《可爱的小狗》（最...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">三年级作文《可爱的小狗》 篇一可爱的小狗小狗是一种非常可爱的动物。它们有着软软的毛发和圆圆的大眼睛，...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/eeda005073f8577.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35984.html" class="text-dark fw-bold text-hover-primary fs-6"> 我们的学校三年级作文六十个字...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">我们的学校三年级作文六十个字 篇一我们的学校很美丽。校园里有很多树木和鲜花，四季都有不同的景色。教室...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/static/assets/images/nopic.gif')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35983.html" class="text-dark fw-bold text-hover-primary fs-6"> 美丽的海底世界三年级作文40...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">篇一：美丽的海底世界海底世界真是美丽极了！在这里，我看到了各种各样奇特的鱼儿和珊瑚。我最喜欢的就是小...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/ee7aeef4eaed254.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35982.html" class="text-dark fw-bold text-hover-primary fs-6"> 三年级作文《有趣的游戏》范文...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">三年级作文《有趣的游戏》范文 篇一有趣的游戏大家好！我是小明，今天我要给大家介绍一个非常有趣的游戏—...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('https://img.pic99.top/hfjzjc/202507/fe1e8c392548f6d.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35981.html" class="text-dark fw-bold text-hover-primary fs-6"> 小学三年级作文假期的生活50...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">小学三年级作文假期的生活500字 篇一假期的生活假期来临了，我可是兴奋得不得了。因为这段时间，我可以...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('http://www.hxlib.cn/d/file/img/32.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/35979.html" class="text-dark fw-bold text-hover-primary fs-6"> 三年级作文姥姥家的葡萄树【优...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">三年级作文姥姥家的葡萄树 篇一姥姥家的葡萄树我家住在一个小镇上，每年暑假，我都会去姥姥家玩。姥姥家有...</span> </div> <!--end::Title--> </div> </div> <!--end::Body--> </div> <!--end::Chart Widget 35--> </div> <!--end::Col--> </div> </div> <!--end::Content container--> </div> <!--end::Content--> </div> <!--end::Content wrapper--> <!--begin::Footer--> <div id="kt_app_footer" class="app-footer"> <!--begin::Footer container--> <div class="app-container container-xxl d-flex flex-column flex-md-row flex-center flex-md-stack py-3"> <!--begin::Copyright--> <div class="text-dark order-2 order-md-1"> <span class="text-muted fw-semibold me-1">2025 ©</span> 华丰美文网 </div> <!--end::Copyright--> <!--begin::Menu--> <ul class="menu menu-gray-600 menu-hover-primary fw-semibold order-1"> <li class="menu-item"> <a href="/news/" target="_blank" class="menu-link px-2">资讯</a> </li> </ul> <!--end::Menu--> </div> <!--end::Footer container--> </div> <!--end::Footer--> </div> <!--end:::Main--> </div> <!--end::Wrapper--> </div> <!--end::Page--> </div> <!--end::App--> <div id="kt_scrolltop" class="scrolltop" data-kt-scrolltop="true"> <!--begin::Svg Icon | path: icons/duotune/arrows/arr066.svg--> <span class="svg-icon"> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <rect opacity="0.5" x="13" y="6" width="13" height="2" rx="1" transform="rotate(90 13 6)" fill="currentColor"></rect> <path d="M12.5657 8.56569L16.75 12.75C17.1642 13.1642 17.8358 13.1642 18.25 12.75C18.6642 12.3358 18.6642 11.6642 18.25 11.25L12.7071 5.70711C12.3166 5.31658 11.6834 5.31658 11.2929 5.70711L5.75 11.25C5.33579 11.6642 5.33579 12.3358 5.75 12.75C6.16421 13.1642 6.83579 13.1642 7.25 12.75L11.4343 8.56569C11.7467 8.25327 12.2533 8.25327 12.5657 8.56569Z" fill="currentColor"></path> </svg> </span> <!--end::Svg Icon--> </div> <!--begin::Javascript--> <script>var hostUrl = "/static/default/pc/";</script> <!--begin::Global Javascript Bundle(mandatory for all pages)--> <script src="/static/default/pc/plugins/global/plugins.bundle.js"></script> <script src="/static/default/pc/js/scripts.bundle.js"></script> <!--end::Global Javascript Bundle--> <!--end::Javascript--> </body> <!--end::Body--> </html>