کہاں انیمیشن سرچ باکس بنائیں
سی ایس ایس کا استعمال کرکے انیمیشن سرچ فرم بنانے کا سیکس کریں。
آئی اینپُٹ فیلڈ پر کلک کریں:
کہاں انیمیشن سرچ باکس بنائیں
پہلی قدم - ایچ تی ایم اضافہ کریں:
<input type="text" name="search" placeholder="Search..">
دوسری قدم - سی ایس ایس اضافہ کریں:
input[type=text] {
width: 130px;
-webkit-transition: width 0.4s ease-in-out;
transition: width 0.4s ease-in-out;
}
/* جبکا ڈاٹا فیلڈ کو توجہ ملنے پر اس کی چوڑائی کو 100% تبدیل کریں */
input[type=text]:focus {
width: 100%;
}
相关页面
教程：HTML 表单
教程：CSS 表单
