zoukankan      html  css  js  c++  java
  • 表单输入框样式

    1. html
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="Images_media_form_elements.css" />
    <title>Title</title>
    </head>
    <body>
    <form>
    <div><label for="name">Name</label>
    <input type="text" id="name"></div>
    <div><label for="email">Email</label>
    <input type="email" id="email"></div>
    <div class="buttons"><input type="submit" value="Submit"></div>
    </form>
    </body>
    </html>

    2. css

    input[type="text"],
    input[type="email"] {
    margin: 0 0 1em 0;
    padding: 10px;
    100%;
    border: 2px solid darkseagreen;
    border-radius: 0px;
    font-weight: bolder;
    font-size: 15px;
    }

    input[type="email"]:hover ,
    input[type="text"]:hover {
    border-radius: 0px;
    border: 2px solid darkseagreen;
    background-color: rgba(54, 168, 130, 0.1);
    font-weight: bolder;
    font-size: 15px;
    }

    input[type="email"]:focus,
    input[type="text"]:focus {
    border: 2px solid #ffd117;
    font-weight: bolder;
    font-size: 15px;
    }
  • 相关阅读:
    JEECG开发总结
    ehcache集群的配置
    spring拦截器
    spring的基本配置
    kindeditor编辑器
    jQuery中的Ajax
    表单验证
    Python中的Random模块
    Open vSwitch FAQ (二)
    Open vSwitch FAQ (一)
  • 原文地址:https://www.cnblogs.com/pascal1000/p/12970694.html
Copyright © 2011-2022 走看看