• html、css 【珍藏】


       行内元素会在水平方向排列,不能包含块级元素,设置width无效,height无效(可以设置line-height),margin上下无效,padding上下无效。

        块级元素 各占据一行,垂直方向排列。从新行开始结束接着一个断行。

        块级元素: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 - 锚点
    * 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都不会产生边距效果。(水平方向有效,竖直方向无效)
     

    使用link和@import有什么区别?

    • (1)link属于XHTML标签,除了加载CSS外,还能用于定义RSS, 定义rel连接属性等作用;而@import是CSS提供的,只能用于加载CSS;
    • (2)页面被加载的时,link会同时被加载,而@import引用的CSS会等到页面被加载完再加载;
    • (3)import是CSS2.1 提出的,只在IE5以上才能被识别,而link是XHTML标签,无兼容问题;
  • 相关阅读:
    Git 基础
    SharePoint 2013 对象模型操作"网站设置"菜单
    SharePoint 2013 隐藏部分Ribbon菜单
    SharePoint 2013 Designer系列之数据视图筛选
    SharePoint 2013 Designer系列之数据视图
    SharePoint 2013 Designer系列之自定义列表表单
    SharePoint 2013 设置自定义布局页
    SharePoint 2013 "通知我"功能简介
    SharePoint 2013 创建web应用程序报错"This page can’t be displayed"
    SharePoint 禁用本地回环的两个方法
  • 原文地址:https://www.cnblogs.com/laopo/p/5612905.html
Copyright © 2020-2023  润新知