Maison > interface Web > js tutoriel > Comment styliser le champ de recherche dans Bootstrap3

Comment styliser le champ de recherche dans Bootstrap3

高洛峰
Libérer: 2016-12-29 11:36:19
original
1724 Les gens l'ont consulté

De nombreux styles dans Bootstrap3 nous obligent à apprendre par essais et erreurs. Lorsque nous créons un champ de recherche simple similaire à Baidu, nous ne savons peut-être pas comment le faire au début, c'est très simple. en utilisant des icônes en ligne

<div class="input-group">
<input type="text" class="form-control input-lg"><span class="input-group-addon btn btn-primary">搜索</span>
</div>
Copier après la connexion

Insérez l'étendue dans la zone de saisie via '.input-group'. Il nous suffit d'ajouter le style du bouton à cette étendue pour obtenir un très bon champ de recherche.

Ce qui précède est la description complète de la méthode de création d'un style de champ de recherche dans Bootstrap 3 présentée par l'éditeur. J'espère que cela vous sera utile. Si vous voulez en savoir plus, veuillez payer. attention au site PHP chinois !

Pour plus d'articles sur la façon de créer un style de champ de recherche avec Bootstrap3, veuillez faire attention au site Web PHP chinois !


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal