• CSS 块状元素和内联元素


    在用CSS布局页面的时候,我们会将HTML标签分成两种,块状元素和内联元素(我们平常用到的div和p就是块状元素,链接标签a就是内联元素)

    块状元素
    一般是其他元素的容器,可容纳内联元素和其他块状元素,块状元素排斥其他元素与其位于同一行,宽度(width)高度(height)起作用。常见块状元素为div和p。

    内联元素
    内联元素只能容纳文本或者其他内联元素,它允许其他内联元素与其位于同一行,但宽度(width)高度(height)不起作用。常见内联元素为“a”

      块状元素 内联元素
    是否允许其他元素同处一行 no yes
    width和height是否起作用 yes no

    块元素(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 - 非排序列表

    内联元素(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 - 定义变量

    * 块状元素 和 内联元素 相互转化

    块状元素转化为内联元素:css设置display:inline ;

    内联元素转化为块状元素:css设置display:block ;

    例子:

     

  • 相关阅读:
    hibernate_0100_HelloWorld
    MYSQL子查询的五种形式
    JSF是什么?它与Struts是什么关系?
    nop指令的作用
    htmlparser实现从网页上抓取数据(收集)
    The Struts dispatcher cannot be found. This is usually caused by using Struts tags without the associated filter. Struts tags are only usable when the
    FCKeditor 在JSP上的完全安装
    Java遍历文件夹的2种方法
    充电电池和充电时间说明
    吃知了有什么好处
  • 原文地址:https://www.cnblogs.com/xiepeixing/p/4334501.html
Copyright © 2020-2023  润新知