zoukankan      html  css  js  c++  java
  • css 添加一个图标始终保持在pc端的右下角

    <div class="dialog_maxdiv" style="display:block;">  
    		<div id="center" style="background:url('http://XXXXX/b281ed2b-0a0f-46f8-9760-18c4b0392e40.png') no-repeat center center / cover;">  
    		</div>  
    	</div>
    

      

    .dialog_maxdiv{position: fixed;
        bottom:3.25em;
        right:3.25em;
        letter-spacing:1px;
        z-index:10;
        transition:0.1s linear;
        -webkit-transition:0.1s linear;
        -moz-transition: 0.1s linear;
        text-transform: uppercase;
        background: #425cbb;
        color: #fff;}
    .dialog_maxdiv #center{
    	height:68px;68px;border:3px solid #FF0000;
    }
    

      

    又设计了一下如图:

    .error_info{position:absolute;display:none;right:1.25em;z-index:9;width:100px;background:#ffffff;min-height:42px;line-height:42px;box-shadow:2px 4px rgba(0, 0, 0, 0.3);-moz-box-shadow:0 2px 4px rgba(0, 0, 0, 0.3);-webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.3);border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;bottom:10em}
    .arrow-left{border-bottom:5px solid transparent;border-right:5px solid transparent;border-top:5px solid white;border-left:5px solid transparent;height:0;left:53px;position:absolute;top:52px;width:0;}
    .error_word{color:#f55854;padding:9px;line-height:25px;}
    <div class="error_info" style="display: block;">
              <div class="arrow-left"></div>
              <p class="error_word">不能为空</p>
        </div>

    自己笔记

  • 相关阅读:
    elasticseacth基础操作--QueryBuilders的使用
    并发编程(八)并发安全
    redis集群 相关
    并发编程(七)线程池
    PMP--综合考试知识点,持续更新中。。。
    常用正则表达式
    测试计划
    ACC(Attribute Component Capability) 即特质,组件,能力
    LockScreen
    Custom Window
  • 原文地址:https://www.cnblogs.com/1246447850qqcom/p/10905848.html
Copyright © 2011-2022 走看看