专业编程基础技术教程

网站首页 > 基础教程 正文

重学前端,认识HTML常用的标签,特殊标签查查文档就够了

ccvgpt 2024-08-03 12:42:09 基础教程 25 ℃

最新:HTML5 标签集合:http://www.html5star.com/manual/html5label-meaning

文档章节:

重学前端,认识HTML常用的标签,特殊标签查查文档就够了

<body> 页面内容 <header> 文档头部 <nav> 导航 <aside> 侧边栏 <article> 定义外部内容(如外部引用的文章) <section> 一个独立的块 <footer> 尾部

页面通常结构:

文本标签:

组合内容标签:

  • <div>
  • <p>
  • <ol>
  • <ul>
  • <dl>
  • <pre>
  • <blockquote>

文档章节:

<body> 页面内容 <header> 文档头部 <nav> 导航 <aside> 侧边栏 <article> 定义外部内容(如外部引用的文章) <section> 一个独立的块 <footer> 尾部

引用:

  • <cite> 引用作品的名字、作者的名字等
  • <q> 引用一小段文字(大段文字引用用<blockquote>)
  • <blockquote> 引用大块文字
  • <pre> 保存格式化的内容(其空格、换行等格式不会丢失)

代码:

<code> 引用代码

格式化:

<b> 加粗 <i> 斜体

强调:

<em> 斜体。着重于强调内容,会改变语义的强调 <strong> 粗体。着重于强调内容的重要性

换行:

<br> 换行

列表:

无序列表

<ul>
 <li>标题</li>
 <li>结论</li>
</ul>

有序列表

<ol>
 <li>第一</li>
 <li>第二</li>
</ol>

自定义列表

一个<dt>可以对应多个<dd>

注意: <dl> 为自定义列表,其中包含一个或多个 <dt> 及 一个或多个 <dd>,并且dt 与 dl列表会有缩进的效果。<pre> 会保留换行和空格,通常与 <code> 一同使用。

<blockquote> 拥有 cite 属性,它包含引用文本的出处,示例如下所示:

<blockquote cite="http://example.com/facts">
 <p>Sample Quote...</p>
</blockquote>

嵌入:

图标签:

canvas 基于像素,性能要求比较高,可用于实时数据展示。svg 为矢量图形图像。

热点区域标签:

img中套用map以及area可以实现点击某部分图片触发一个链接,点击另一部分触发另一个链接

表格

表格代码:

使用 colspan=val 进行跨列,使用 rowspan=val 进行跨行。

表单:

常用的标签产就这些了

Tags:

最近发表
标签列表