一款好看的文本框点击效果

最新推荐文章于 2021-06-11 14:30:34 发布

XC_Echizen

最新推荐文章于 2021-06-11 14:30:34 发布

阅读量568

点赞数

分类专栏： Html 文章标签：文本框点击效果

本文链接：https://blog.csdn.net/baidu_39169957/article/details/74451999

版权

Html 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">

  <style type="text/css">
    .mytxt {
      color:#333;
      line-height:normal;
      padding:4px;
      font-size:15px;
      outline-width:medium;
      outline-style:none;
      outline-color:invert;
      border-radius:3px;
      text-shadow:0px 1px 2px #fff;
      background-attachment:scroll;
      background-color:white;
      border:#ccc 1px solid;
    }
    .mytxt:focus {
      border: 1px solid #fafafa;
      -webkit-box-shadow: 0px 0px 6px #007eff;
      -moz-box-shadow: 0px 0px 5px #007eff;
      box-shadow: 0px 0px 5px #007eff;

    }
  </style>
</head>
<body>

<input type="text" value="" class="mytxt"/>

</body>
</html>

效果：

XC_Echizen

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
一款好看的文本框点击效果

.mytxt { color:#333; line-height:normal; padding:4px; font-size:15px; outline-width:medium; outline-style:none; outline-color:invert; border-radius:3px;
复制链接

扫一扫

专栏目录