鼠标悬浮提示信息文字个性化（包括背景，文字大小调整）

这里列举一个单选按钮显示提示信息的情况，其他情况可以类比：

html 部分

 <td>
     <a class="tiptool" title="今天天气不错。<br/>可是，我感觉会下雨" >
         <input type="radio"  value=1  onclick="get()">
     </a>
 </td>

css部分

<style>
    #tiptool{
        position:absolute;
        padding-left: 10px;
        padding-right: 10px;
        background:#3499da;/*设置背景色*/
        color:#fff;
        display:none;
        height: auto;/*设置这个是为了文字可以换行*/
        line-height: 30px;
        border-radius:5px;
        font-size:16px;/*设置这个是为了文字大小*/
    }
    td>a{
        text-decoration:none;
        color:#333333;
    }
    td>a:hover{
        text-decoration:none;
        color:#333333;
    }

</style>

js部分

<script>
    var x = 20;
    var y = 15;
    var newtitle = '';
    $('a.tiptool').mouseover(function(e) {
        newtitle = this.title;
        this.title = '';
        $('body').append('<div id="tiptool">' + newtitle + '</div>');
        $('#tiptool').css({
            'left': (e.pageX + x + 'px'),
            'top': (e.pageY + y + 'px')
        }).show();
    }).mouseout(function() {
        this.title = newtitle;
        $('#tiptool').remove();
    }).mousemove(function(e) {
        $('#tiptool').css({
            'left': (e.pageX + x + 'px'),
            'top': (e.pageY + y + 'px')
        }).show();
    })
</script>

其他1

背景图如何填充整个div？

style="background:url('img/bg.png')no-repeat;background-size:100% 100%; "

除此之外，可以了解一下，下面几种填充方式的用法：

background-size:contain;
background-size:cover;
background-size:include;

参考文章：
https://blog.csdn.net/wd4java/article/details/50537562

未完待续 >>