PDA

View Full Version : سوال: گرد کردن و سایه دادن به textbox فرم هنگام کلیک کردن



ghazal_73
چهارشنبه 08 آبان 1392, 17:40 عصر
یه فرم ورود اطلاعات داریم که میخایم وقتی روی تکس باکسی کلیک میکنیم هم border بگیره هم کمی سایه دار بشه. جوری که تمام زوایای و گوشه های کادر متن یه جور بشه. با استفاده از html5/css. باید چیکار کرد؟؟؟

Omid Jackson
چهارشنبه 08 آبان 1392, 17:51 عصر
میتونین با استفاده از سلکتور :focus این کار ها رو بکنین
http://w3schools.com/cssref/css_selectors.asp

hossin.esm
چهارشنبه 08 آبان 1392, 18:26 عصر
کد را از بوت استرپ کپی کردم


<style>
textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] {
background-color: #FFFFFF;

border: 1px solid #CCCCCC;

}
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] {
border-radius: 4px 4px 4px 4px;

color: #555555;
height: 25px;
line-height: 25px;
padding: 4px 6px;
vertical-align: middle;
}

textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus {
border-color: rgba(82, 168, 236, 0.8);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(82, 168, 236, 0.6);

outline: 0 none;
}
</style>

<div>
<input type="text" name="test" size="20">
</div>