• 08-溢出属性与定位


    #### 单行文本溢出显示省略号
      * 溢出属性 overflow
        + visible 默认值
        + hidden 溢出隐藏
        + scroll 显示滚动条
          - overflow-y y轴滚动
          - overflow-x x轴滚动
        + **auto** 没有超出的时候正常显示,超出之后才显示滚动条  
      * **单行文本超出宽度显示省略号**
        + 设置宽度 
        + 设置不换行 white-space:nowrap
        + 设置溢出隐藏 overflow:hidden;
        + 设置文本溢出显示省略号 text-overflow:ellipsis;
    #### 圆角属性 border-radius:数值+px    
    #### 定位 position
      * static 默认值
      * relative 相对定位
        + 参考物:自己本身的位置
        + 方向:left/right/top/bottom: 数值+px 可以设置负数 百分比,
        + 特点
          - 移动之后依然占据空间
        + 应用:移动盒子 
      * absolute 绝对定位
        + 参考物:参考有定位属性(除了static)的祖先元素,定位元素通过一层一层想上找,找到有定位的祖先元素,如果找到body依然没有找到有定位的祖先元素,参考浏览器窗口(**子绝父相**)
        + 方向:left/right/top/bottom: 数值+px 可以设置负数 
        + 特点  
          - 脱离文档流,且文字能被遮挡
          - 块级元素设置margin:0 auto;会失效
          - 内联元素设置定位转换成块元素
        + 应用场景:有重叠效果的需求
    例图
      
        + 实现盒子水平垂直居中
          - 第一种
            1. 设置该元素left:50%;(参考元素宽度的一半)margin-left:当前盒子宽度的一半
            2. 设置该元素top:50%;(参考元素高度的一半)margin-top:当前盒子高度的一半
          - 第二种  
            1. 设置left:0;top:0;right:0;bottom:0;
            2. 设置margin:auto; 上下左右居中
    #### 设置透明色
      rgba(253, 196, 215);
      a的取值是0-1之间的数 0:完全透明 1:不透明 值越小越透明      
    #### 设置圆形
      border-radius: 50%或者100%;
  • 相关阅读:
    数据结构之利用递归解决八皇后问题
    SpringBoot注解大全
    shiro框架中出现的错误There was an unexpected error (type=Unauthorized, status=401).
    shiro权限控制
    shiro的整合“心路历程”
    _T宏的使用
    根据文件的路径 分割文件名 文件后缀
    将选中的图片文件以图片形式 (显示在对话框内)或(直接发送出去)
    对话框内粘贴图片文件会直接发送,改为粘贴图片后直接将图片显示在对话内。
    数据库按日期查询,右侧日期内的数据无法现实问题。
  • 原文地址:https://www.cnblogs.com/qdbj2020/p/13457728.html
Copyright © 2020-2023  润新知