zoukankan      html  css  js  c++  java
  • 行内元素和块级元素

    2013-01-05 11:40 by greenal, 67931 阅读, 3 评论, 收藏, 编辑

    1 块级元素:div  , p  , form,   ul,  li ,  ol, dl,    form,   address,  fieldset,  hr, menu,  table
       行内元素:span,   strong,   em,  br,  img ,  input,  label,  select,  textarea,  cite,  
                       
    内联元素(inline element)
    a - 锚点
    b - 粗体(不推荐)
    br - 换行
    em - 强调
    font - 字体设定(不推荐)
    i - 斜体
    img - 图片
    input - 输入框
    label - 表格标签
    select - 项目选择
    small - 小字体文本
    span - 常用内联容器,定义文本内区块
    strike - 中划线
    strong - 粗体强调
    sub - 下标
    sup - 上标
    textarea - 多行文本输入框
    tt - 电传文本
    u - 下划线
    内联元素(行内元素)内联元素(inline element)
    * a - 锚点
    * abbr - 缩写
    * acronym - 首字
    * b - 粗体(不推荐)
    * bdo - bidi override
    * big - 大字体
    * br - 换行
    * cite - 引用
    * code - 计算机代码(在引用源码的时候需要)
    * dfn - 定义字段
    * em - 强调
    * font - 字体设定(不推荐)
    * i - 斜体
    * img - 图片
    * input - 输入框
    * kbd - 定义键盘文本
    * label - 表格标签
    * q - 短引用
    * s - 中划线(不推荐)
    * samp - 定义范例计算机代码
    * select - 项目选择
    * small - 小字体文本
    * span - 常用内联容器,定义文本内区块
    * strike - 中划线
    * strong - 粗体强调
    * sub - 下标
    * sup - 上标
    * textarea - 多行文本输入框
    * tt - 电传文本
    * u - 下划线
    * var - 定义变量

    块元素(block element)
    * address - 地址
    * blockquote - 块引用
    * center - 举中对齐块
    * dir - 目录列表
    * div - 常用块级容易,也是css layout的主要标签
    * dl - 定义列表
    * fieldset - form控制组
    * form - 交互表单
    * h1 - 大标题
    * h2 - 副标题
    * h3 - 3级标题
    * h4 - 4级标题
    * h5 - 5级标题
    * h6 - 6级标题
    * hr - 水平分隔线
    * isindex - input prompt
    * menu - 菜单列表
    * noframes - frames可选内容,(对于不支持frame的浏览器显示此区块内容
    * noscript - )可选脚本内容(对于不支持script的浏览器显示此内容)
    * ol - 排序表单
    * p - 段落
    * pre - 格式化文本
    * table - 表格
    * ul - 非排序列表

    可变元素
    可变元素为根据上下文语境决定该元素为块元素或者内联元素。

    * applet - java applet
    * button - 按钮
    * del - 删除文本
    * iframe - inline frame
    * ins - 插入的文本
    * map - 图片区块(map)
    * object - object对象
    * script - 客户端脚本
     
     
    2  区别:
       1)块级元素会独占一行,其宽度自动填满其父元素宽度
            行内元素不会独占一行,相邻的行内元素会排列在同一行里,知道一行排不下,才会换行,其宽度随元素的内容         而变化
       2) 块级元素可以设置 width, height属性,行内元素设置width,  height无效
             【注意:块级元素即使设置了宽度,仍然是独占一行的】
       3) 块级元素可以设置margin 和 padding.  行内元素的水平方向的padding-left,padding-right,margin-left,margin-right 都产生边距效果,但是竖直方向的padding-top,padding-bottom,margin-top,margin-bottom都不会产生边距效果。(水平方向有效,竖直方向无效)
  • 相关阅读:
    高斯消元学习
    HDU 4596 Yet another end of the world(解一阶不定方程)
    Codeforces Round #318 div2
    HDU 4463 Outlets(一条边固定的最小生成树)
    HDU 4458 Shoot the Airplane(计算几何 判断点是否在n边形内)
    HDU 4112 Break the Chocolate(简单的数学推导)
    HDU 4111 Alice and Bob (博弈)
    POJ 2481 Cows(线段树单点更新)
    HDU 4288 Coder(STL水过)
    zoj 2563 Long Dominoes
  • 原文地址:https://www.cnblogs.com/lizhenlin/p/7423207.html
Copyright © 2011-2022 走看看