Que sont les menus déroulants bootstrap ?

Les menus déroulants Bootstrap sont disponibles dans les types suivants : Liste déroulante de base : affiche le menu après avoir cliqué ou survolé l'élément. Menu déroulant divisé : ajoutez des séparateurs aux éléments de menu de groupe. Menu déroulant Titre : utilisez les titres pour organiser les éléments de menu. Menu déroulant Formulaire : contient des éléments de formulaire. Liste déroulante focalisable : autoriser la navigation au clavier. Désactiver le menu déroulant : désactivez l'interaction de l'utilisateur. Menu déroulant Aligner à droite : alignez le menu à droite sur le déclencheur.

Types de menus déroulants Bootstrap

Bootstrap propose une variété de types de menus déroulants pour répondre aux différents besoins des utilisateurs :

Menu déroulant de base :

• est le menu déroulant le plus courant. -type de menu vers le bas.
• Créé en ajoutant la classe dropdown-toggle et l'attribut data-bs-toggle="dropdown" sur la balise <a> . <a> 标签上添加 dropdown-toggle 类和 data-bs-toggle="dropdown" 属性创建。
• 点击或悬停（取决于 data-bs-toggle 属性值）时，它会在 <a> 标签下方显示一个包含菜单项的菜单。

分割下拉菜单:

• 在基本下拉菜单中添加一条分隔线，将菜单项分组为不同的部分。
• 通过添加 dropdown-divider 类创建。

标题下拉菜单:

• 提供一个标题，用于组织和标记下拉菜单中的菜单项。
• 通过添加 dropdown-header 类创建。

表单下拉菜单:

• 包含表单元素（如输入字段或选择框）。
• 通过在菜单项中添加必要的 HTML 标记创建。

可聚焦下拉菜单:

• 允许用户使用键盘导航和选择菜单项。
• 通过添加 dropdown-item focusable 类创建。

禁用下拉菜单:

• 禁止用户与菜单交互。
• 通过添加 disabled 属性创建。

右对齐下拉菜单:

• 将菜单右对齐到触发器元素。
• 通过添加 dropdown-menu-end
Lorsque vous cliquez ou survolez (en fonction de la valeur de l'attribut data-bs-toggle), il affichera un menu avec des éléments de menu sous la balise <a>.

🎜🎜🎜Split Dropdown : 🎜🎜🎜🎜 Ajoutez une ligne de séparation au menu déroulant de base pour regrouper les éléments de menu en différentes sections. 🎜🎜Créé en ajoutant la classe dropdown-divider. 🎜🎜🎜🎜Titre déroulant : 🎜🎜🎜🎜 Fournit un titre pour organiser et étiqueter les éléments de menu dans la liste déroulante. 🎜🎜Créé en ajoutant la classe dropdown-header. 🎜🎜🎜🎜Formulaire déroulant : 🎜🎜🎜🎜Contient des éléments de formulaire (tels que des champs de saisie ou des zones de sélection). 🎜🎜Créé en ajoutant les balises HTML nécessaires dans les éléments de menu. 🎜🎜🎜🎜Déroulante focalisable : 🎜🎜🎜🎜Permet aux utilisateurs de naviguer et de sélectionner des éléments de menu à l'aide du clavier. 🎜🎜Créé en ajoutant la classe dropdown-item focusable. 🎜🎜🎜🎜Désactiver le menu déroulant : 🎜🎜🎜🎜Désactive l'interaction de l'utilisateur avec le menu. 🎜🎜Créé en ajoutant l'attribut disabled. 🎜🎜🎜🎜Menu déroulant Aligner à droite : 🎜🎜🎜🎜 Alignez à droite le menu sur l'élément déclencheur. 🎜🎜Créé en ajoutant la classe dropdown-menu-end. 🎜🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!