标签：ott set char color esc 清除 spl 显示 lin
一.效果图
二、.
三、源码
<!doctype html> <html> <head> <meta charset="UTF-8"> <meta name="keywords" content="关键词"> <meta name="description" content="描述"> <title>登陆框</title> <title>Document</title> <style> body{ margin: 0; padding: 0; } #login{ margin: 100px auto; width: 300px; height: 300px; background-color: #66ffff; border-radius: 10px; text-align: center; } #login:before{/*头部颜色变换样式，只是显示样式，不是实际内容，使用伪类*/ content: ‘‘;/*激活伪类*/ display: block;/*变为块级元素，才能显示出来*/ width: 100%; height: 10px; background-image: -webkit-linear-gradient(left,#390 0%,#390 20%,#60f 20%,#60f 40%,#3cf 40%,#3cf 60%,#f30 60%,#f30 80%,#fc3 80%,#fc3 100%);/* -webkit: 使用谷歌内核 -linear-gradient：颜色渐变属性，css3新属性只适用于谷歌内核 */ border-radius: 10px 10px 0 0; } #login h1{ color: #096; } #login input{ width: 240px; height: 40px; margin-bottom: 30px; border-radius: 5px; } .text{ border: 1px solid #333; text-indent: 20px;/* 缩进 */ } .submit{ border: none;/*清除边框样式*/ background-color: #2290de; } </style> </head> <body> <div id="login"> <h1>Login</h1> <input type="text" class="text" placeholder="请输入用户名"><!-- placeholder 文本提示 --> <input type="password" class="text" placeholder="请输入密码"> <input type="submit" class="submit"> </div> </body> </html>
标签：ott set char color esc 清除 spl 显示 lin
原文地址：https://www.cnblogs.com/Liuxingtao/p/10313971.html
