¿Por qué usar bootstrap?
- Bootstap es el marco más popular en el front-end (cualquier sitio web de aprendizaje importante lo dice ... emmm),
ya que es el más popular, entonces, por supuesto, es necesario aprender, puede ayudarnos a desarrollar proyectos web rápidamente
y en varios dispositivos Hay un buen diseño flexible, sin un conjunto en el lado de la PC, un conjunto en el lado móvil, un conjunto en la cara y un conjunto en la parte posterior. Esto no es bueno y está demasiado cansado, por lo que es necesario un diseño flexible
Cuales son los beneficios ?
- Anteriormente, escribimos una barra de navegación. Primero, ul está usando flotante, posicionamiento y una larga lista. ¡Esto no es aceptable para nosotros, gente perezosa! ! ! Así que vino, bootsrtap ha definido muchos componentes comunes para nosotros, como un cuadro negro, como la barra de navegación, simplemente déjalo, solo mira bien botón i, menú desplegable, puedes agregar directamente el nombre de clase correspondiente , Después de leerlo, aún puede ser confuso, entonces entenderemos a qué nos referimos al experimentar
Preparación:
- Descargue la biblioteca de recursos en el sitio web oficial . Después de la descarga, use la importación de enlaces como el archivo css, el archivo js, la
<srcipt>importación, la descarga y la importación de notas. Es una molestia. Soy una persona perezosa, me dijo que los obtuviera ? ? No te preocupes, el hombre perezoso importa la biblioteca de recursos, está aquí. - Se recomienda utilizar la biblioteca en el CDN de Staticfile en China. Es un poco confuso. Está bien usar el enlace de importación y copiar el siguiente enlace directamente en el encabezado de la página.
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
- Descargar complementos
Abra vscode (usé vsc, varias funciones de complementos, cómodo de usar), seleccione funciones extendidas (ctrl + shit + x), busque fragmentos de bootstrap 3 y fragmentos de bootstrap 4, después de la instalación, vuelva a cargar. Este complemento es una función de recordatorio, ¡veamos cómo usarlo! ! !
Comienza a practicar:
- Comenzando con bs3- o palabras clave, tomemos los componentes comúnmente usados de la página
- bs3-form o form, automáticamente aparecerá múltiples estilos para que usted elija, simplemente haga clic en uno para ver el estilo correspondiente, hay radio, casilla de verificación, menú de selección desplegable, cuadro de entrada, etc. Echemos un vistazo breve
- El menú desplegable de selección se genera con un solo clic, y el texto y el ancho pueden ser modificados por usted mismo.
Genere hermosos botones de radio con un clic
- Alguien preguntó, usted dijo que se puede generar con un clic, donde es tan simple, lo correcto es tan simple, cuando ingresamos al formulario, se generará un mensaje, siempre conocemos la casilla de verificación, buscamos la palabra clave, sí, hay muchas Si no está familiarizado con él, puede probarlo. ¿Cuál es lo que más queremos? Otros botones, barras de navegación y mapas de rotación de páginas web son similares, ingrese palabras clave y luego encuentre el estilo que necesita.
- También hay un importante punto de conocimiento: aunque es fácil de usar, ¿qué debo hacer si quiero cambiarlo sobre esta base? Es como copiar la tarea, no siempre es lo mismo, soy vago, pero no estúpido, hhh. Las personas cuidadosas pueden encontrar que su estilo se establece básicamente por el nombre de la clase, entonces, ¿qué pasa si el menú desplegable de arriba no quiero que el toque del mouse se convierta en un fondo azul? Podemos establecer la prioridad sobre esta base Selectores más altos, como el selector de id, siempre que el peso sea más alto que él (la cadena de problemas sobre los pesos está por debajo ), puede cubrir su estilo original (por supuesto, no hay demasiados problemas, o no quieres ser azul Antecedentes, puede modificar directamente el archivo fuente descargado del sitio web oficial, así que también mire diligentemente el artículo introductorio de la persona perezosa (hhh )
Cómo entender y calcular el peso simplemente
¡Se puede recoger en cualquier momento para uso futuro! ! !
