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

    html块元素和内联元素:

    对于html各种标签/元素,可以从块的层面做一个分类:要么是block(块元素),要么是inline(内联元素)。

    block元素的特点:

    总是另起一行开始;

    高度,行高以及顶、底边距都可控制;

    宽度缺省是它所在容器的100%,除非设定一个宽度。

    inline元素的特点:

    和其它元素都在一行上;

    高度,行高以及顶、底边距不可改变;

    宽度就是它所容纳的文字或图片的宽度,不可改变。

    块元素(block element) HTML标签分类明细

    address - 地址

    blockquote - 块引用

    center - 举中对齐块

    dir - 目录列表

    div - 常用块级容易,也是css layout的主要标签

    dl - 定义列表

    fieldset - form控制组

    form - 交互表单 (只能用来容纳其它块元素)

    h1-h6 - 标题

    hr - 水平分隔线

    isindex - input prompt

    menu - 菜单列表

    noframes - frames可选内容,(对于不支持frame的浏览器显示此区块内容

    noscript - 可选脚本内容(对于不支持script的浏览器显示此内容)

    ol - 排序表单

    p - 段落

    pre - 格式化文本

    table - 表格

    ul - 非排序列表

    内联元素(inline element) HTML标签分类明细

    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 - 定义变量

    ◎可变元素是基于以上两者随环境而变化的,它的基本概念就是根据上下文关系确定该元素是块元素还是内联元素。一旦确定了它的类别,它就遵循块元素或者内联元素的规则限制。

    可变元素   HTML标签分类明细

    applet - java applet  

    button - 按钮  

    del - 删除文本  

    iframe - inline frame  

    ins - 插入的文本  

    map - 图片区块(map)  

    object - object对象  

    script - 客户端脚本

    但是通过CSS,我们可以摆脱上面表格里HTML标签归类的限制,自由地在不同标签/元素上应用我们需要的属性。

    css display应用:

    定义和用法

    display 属性规定元素应该生成的框的类型。

    对于XML,由于XML 没有内置的这种层次结构,所有display是绝对必要的。

    默认值:inline

    继承性:no

    版本:CSS1

    JavaScript 语法:object.style.display="inline"

    所有主流浏览器都支持 display 属性。

    可选的值

    none    此元素不会被显示。

    block   此元素将显示为块级元素,此元素前后会带有换行符。

    inline 默认。此元素会被显示为内联元素,元素前后没有换行符。

    inherit 规定应该从父元素继承 display 属性的值。

    ……

  • 相关阅读:
    Python3.x:定义一个类并且调用
    Spring编码过滤器:解决中文乱码
    Web.xml中自动扫描Spring的配置文件及resource时classpath*:与classpath:的区别
    你是否属于中等收入群体
    Python3.x:BeautifulSoup()解析网页内容出现乱码
    Activiti工作流引擎数据库表结构
    Java:出现错误提示(java.sql.SQLException:Value '0000-00-00' can not be represented as java.sql.Date)
    Django框架搭建(windows系统)
    Eclipse配置多个jdk
    Activiti:创建activiti工程
  • 原文地址:https://www.cnblogs.com/sntetwt/p/3283198.html
Copyright © 2011-2022 走看看