经过整理的百度得到的CSS实现显示ToolTips提示气泡的方法为：

    .tool-tip {
        position: absolute;
        bottom: 50px;
        background-color: lightgreen;
        border: 1px solid #ccc;
        border-radius: 10px;
        padding: 10px;
        font-size: 22px;
        color: #fff;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }
    .tool-tip::before {
        content: '';
        position: absolute;
        top: 100%;
        left: 10%;
        border-width: 10px;
        border-style: solid;
        border-color: lightgreen transparent transparent transparent;
    }
    .tool-tip-left {
        position: absolute;
        bottom: 100px;
        left: 100px;
        background-color: lightgreen;
        border: 1px solid #ccc;
        border-radius: 10px;
        padding: 10px;
        font-size: 22px;
        color: #fff;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }
    .tool-tip-left::before {
        content: '';
        position: absolute;
        top: 10px;
        left: -20px;
        border-width: 10px;
        border-style: solid;
        border-color: lightgreen transparent transparent transparent;
        transform: rotate(90deg);
    }

    <div class="tool-tip">asdfadfafafadsf</div>
    <div class="tool-tip-left">asdfadfafafadsf</div>

    
    
asdfadfafafadsf
    
asdfadfafafadsf
                                
    ————www.v-signon.com学习者共勉