HTML_行内元素、块级元素、空元素

  • 内联元素
  • 叫法有内联元素、内嵌元素、行内元素、直进式元素
  • 一般都是基于语义级(semantic)的基本元素,它只能容纳文本或者其他内联元素,通常被包括在块元素中使用。
  • 内联元素有这些
    • a - 锚点
      abbr - 缩写
      the <abbr title="world wield web constium">W3C</abbr>is important;
      abbr.jpg

      b - 粗体(不推荐)、strong - 粗体强调、em - 斜体重要{均是双标签}
      在没有其他合适标签更合适时,才应该把 <b> 标签作为最后的选项。HTML5 规范声明:应该使用 <h1> - <h6> 来表示标题,使用<em>标签来表示强调的文本,应该使用<strong> 标签来表示重要文本。
      这些也都可通过font-weight属性来设置。
      bdo 定义文本方向
      <br /> rtl: <bdo dir="rtl">here is some text</bdo> <br /> ltr: <bdo dir="ltr">here is some text</bdo>
      dbo.jpg

      big - 较原来字体大一号。<big><big>12</big></big>
      br - 换行<br> <br />clear属性
      cite - 引用,斜体显示
      code - 计算机代码(在引用源码的时候需要)
      dfn - 定义字段
      i - 斜体
      img - 图片
      input - 输入框
      kbd - 定义键盘文本
      samp - 定义范例计算机代码
      var - 定义变量
      q - 短引用
      small - 小字体文本
      span - 常用内联容器,定义文本内区块
      label - 表格标签
      del-删除部分
      ins-新插入部分
      select - 项目选择
      sub - 下标
      sup - 上标
      textarea - 多行文本输入框
      iframe-创建包含另一个文档的内联框架
      <iframe src="block_elements.html" width="" height=""></iframe>
       
      iframe.jpg

      (map,area)-带有可点击区域的图像映射
      < img src="../../LG/image/ff8080814aecc157014aecdf36aa002a.jpg" width="300px" border="0" usemap="#test" alt="test" />
      <map name="test" id="test">
      <area shape="circle" coords="20,20,50" href="block_elements.html" alt="" />
      </map>

  • 块级元素
  • address - 定义文档或文章的作者的联系信息,不要局限于地址,以斜体的形式展现。
    <address>Written by miss_du</address>.jpg

    blockquote - 标签定义块引用,左右两边会自动进行缩进
    俗话说得好
    <blockquote>
    笨鸟先飞
    </blockquote>
    blockquote.jpg

    dir - 目录列表
    <dir>
    <li>第一章</li>
    <li>第二章</li>
    <li>第三章</li>
    </dir>
    dir.jpg

    dl>dt+dd-定义列表,这个经常用,就不距离啦
    ul>li-定义无须列表
    ol>li-定义有序列表
    div常用的块级元素,用于css布局。
    (fieldest,legend)-组合表单中的相关元素
    <fieldset id="">
    <legend>性别</legend>
    女:<input type="radio" name="" id="" value="" />
    男:<input type="radio" name="" id="" value="" />
    </fieldset>
    fieldset.jpg

      form - 交互表单
      h1 ~h6
      hr - 水平分隔线
      noframes - frames可选内容,(对于不支持frame的浏览器显示此区块内容
     noscript - 可选脚本内容(对于不支持script的浏览器显示此内容)
     pre - 格式化文本,,主要用于显示源码。
    <pre>
    <a>
    显示源码了么?
    </a>
    </pre>
    pre.jpg

     table - 表格
    <table border="" cellspacing="" cellpadding="">
    <caption>hello</caption>
    <thead style="background: black;color: #fff;">
    <tr>
    <th>Header</th>
    <th>Header</th>
    </tr>
    </thead>
    <tbody>
    <tr>
    <td>Data</td>
    <td>Data</td>
    </tr>
    </tbody>
    </table>
    • 需要注意:caption元素在表格中重复会折行,但是脱离表格,重复不会折行。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 205,236评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,867评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,715评论 0 340
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,899评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,895评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,733评论 1 283
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,085评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,722评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,025评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,696评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,816评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,447评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,057评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,009评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,254评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,204评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,561评论 2 343

推荐阅读更多精彩内容