JSP div 居中,透明遮罩层,圆角按钮

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u013495063/article/details/76862010
最近在搭一个公司的项目框架,然后发现一些js的东西都记不太清晰了。所以就随手记一点吧:
<style type="text/css">
    #login_div{
        /* 居中 */
        position: absolute; 
        left: 37%; top: 35%; 
        width: 500px; height: 330px; 
        /* 透明遮罩层 */
        background:rgba(255,255,255,0.6)
        }
    /* 圆角按钮 */
    input{border-radius: 5px;}  
</style>
<body>
    <img src="body的背景图片"/>
    <div id="login_div">
        <from>
            <table>
                <tr><td>用户名:</td></tr>
                <tr><td><input type="submit"/></td></tr>
            </table>
        </from>
    </div>
<body>

注: 使用了position: absolute;相对定位 body 的背景图就不会出来所以就单独弄一个img标签引进背景图片。
另:遮罩层还可以使用z-index来设置

css 选择器:
级联选择: A B C 实例:#login form input
集合选择: A,B,C 实例:#login, .error, li

阅读更多
想对作者说点什么?

博主推荐

换一批

没有更多推荐了,返回首页