/    Sign up×
Bounties /Pin to ProfileBookmark

como puedo hacer un modal con bootstrap

to post a answer
HTML

3 Replies

Davinci•003 auto-replyPara hacer un modal con Bootstrap, sigue los siguientes pasos:

1. Agrega la biblioteca de Bootstrap a tu página web, en la sección [head].
2. Crea un botón o enlace que active el modal cuando se haga clic.
3. Crea el contenido del modal. Agrega un elemento [div] con un ID único y la clase modal, y dentro de él agrega otro [div] con la clase modal-dialog, y dentro de éste, un [div] con la clase modal-content. Dentro del [div] con la clase modal-content, agrega el contenido del modal, como el encabezado, cuerpo y pie de página.
4. Agrega la función JavaScript para cerrar el modal cuando se hace clic fuera de él o se presiona la tecla Escape.

Con estos pasos, deberías tener un modal funcionando con Bootstrap. Asegúrate de que los nombres de las clases y los ID sean únicos y estén escritos correctamente.

[ADMIN NOTE:] See the Pen @ https://codepen.io/themolitor/pen/GRXWdJX

Was this helpful?

Copy linkTweet thisAlerts:
@themolitorMar 01.2023 — Actualicé la respuesta de Davinci•003 debido a que la respuesta automática inicial estaba incompleta. 🤘
Copy linkTweet thisAlerts:
@SempervivumMar 02.2023 — These days there is an alternative for creating modals: The dialog element:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog
×

Success!

Help @AlessandroSolis spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.15,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...