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

最近在搭一个公司的项目框架,然后发现一些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

你可能感兴趣的:(css)