html标签——Html学习笔记1

<!DOCTYPE html> 文档类型声明,告诉浏览器如何渲染页面;若不加,渲染会用怪异模式渲染

<html lang="en"></html> lang属性告诉浏览器当前使用文字

<meta charset="UTF-8">
<meta name="keywords" content="前端 饮食"> 引擎优化
<meta name="description" content="这是一段描述"> 搜索引擎搜索时候展示的描述

h1~h6 标题

p标签

  • 段落

a标签

  • <a href="www.baidu.com" target="_blank">搜一下</a> 链接,链到一个地址
  • <a href="#" > #表示锚点
  • <a href="/getCourse" > 跳到当前网站的该路径URL

img

  • <img src="a.png" alt="图片"> alt属性表示图片打不开时候显示的内容
  • 自闭合标签,后面不需要加/

<div>

  • 用于给页面划分区块

ul li

  • ul:无序列表
  • 可以嵌套
<ul>
    <li>首页</li>
    <li>关于</li>
    <li>
        <ul>
            <li>联系</li>
            <li>更多</li>
        </ul>
    </li>
</ul>

ol li

  • 有序列表
<ol>
  <li>放学</li>
  <li>吃饭</li>
  <li>睡觉</li>
</ol>

dl dt dd

  • 自定义列表
  • 用于展示一系列“标题:内容...”的场景
<dl>
  <dt>姓名:</dt>
  <dd>小白</dd>
  <dt>性别:</dt>
  <dd>女</dd>
  <dt>爱好:</dt>
  <dd>王者荣耀</dd>
  <dd>吃火锅</dd>
</dl>

button

strong em

  • em 强调
  • 尽管现在 <em> 标签修饰的内容都是用斜体字来显示,但这些内容也具有更广泛的含义,将来的某一天,浏览器也可能会使用其他的特殊效果来显示强调的文本。如果你只想使用斜体字来显示文本的话,请使用 <i> 标签。除此之外,文档中还可以包括用来改变文本显示的级联样式定义。
  • strong 强调性更强
 <p>汤包<em>胖了</em></p>
 <p>汤包<strong>又胖了</strong></p>

iframe

  • 用于嵌入一个页面
  • 注意跨域操作问题
<iframe src="https://v.qq.com/" name="myPage" frameborder="0"></iframe>

一个神奇的效果

<p><a href="https:www.baidu.com" target="myPage">百度一下</a></p>

点击链接后:


table

  • 用于展示表格
  • thead tbody tfoot可省略
  • 浏览器会自动添加border-collapse: collapse 用于合并边框
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容