"前端Bootstrap Es6 vue学习笔记-基础环境配置和样式排版"

黑色，对齐方式居左，加上下边距 1em 2.引入 bootstrap.css 样式文件后，网页上所有元素均使用 bootstrap 的样式 3.页内样式优先级高于外部样式表，行内样式优先级高于页内样式表三 响应式布局1.通过栅格系统实现，将页面水平分成 12 列，通过设置不同的列宽度来实现响应式布局2.通过媒体查询来设置不同的排版和布局3.在 bootstrap 中，使用多个 class 来控制元素在不同设备上的显示和隐藏四 组件1.按钮：通过给元素添加 class 来设置不同样式和状态2.导航栏：通过添加 class 来设置不同样式和排版3.轮播图：通过添加 class 来设置不同样式和效果4.表格：通过添加 class 和实现 JavaScript 初始化来设置不同样式和功能五 内置插件1.弹窗：通过添加 class 和实现 JavaScript 初始化来设置不同样式和功能2.下拉菜单：通过添加 class 和实现 JavaScript 初始化来设置不同样式和功能 六 HTML5 CSS3 支持1.Bootstrap 提供了一些 HTML5 和 CSS3 的元素和属性的默认样式和效果2.使用 css3 的一些新特性来实现更酷炫的效果七 LESS 动态样式1.Less 是一种 CSS 预处理语言，可编写更优雅、可复用和易于维护的 CSS 代码2.通过使用 Less，可以定义变量、嵌套、混合和函数等特性，使样式表更具可读性和可维护性八 Vue.js1.一种用于构建用户界面的渐进式框架2.通过组件化的方式构建用户界面3.通过双向数据绑定的方式实现数据和视图的同步更新4.通过指令来实现 DOM 操作和事件绑定5.通过路由来实现单页面应用的页面切换------------前端Bootstrap Es6 vue学习笔记，内容围绕着前端开发的三大核心技术：Bootstrap、Es6和Vue.js展开。 首先，介绍了Bootstrap框架的基础环境配置。通过开发者工具的"f12 toggle device toolbar"功能，可以模拟移动设备的视口界面，更好地进行移动端开发。Bootstrap是Twitter公司的开源框架，基于HTML/css/js开发，拥有跨设备、跨浏览器的特性，提供了全面的组件和内置的jQuery插件，同时支持HTML5和CSS3的新特性。在样式排版方面，Bootstrap将全局的字体大小设置为14px，行高设置为1.428（20px），段落元素设置等于行高的一半（10px），颜色设置为黑色，并对齐方式设置为居左。当引入了Bootstrap样式文件后，页面上的所有元素都会应用Bootstrap的样式。并且，页内样式的优先级高于外部样式表，行内样式的优先级高于页内样式表。 其次，介绍了Bootstrap的响应式布局。Bootstrap通过栅格系统来实现响应式布局，将页面水平分成12列，通过设置不同的列宽度来实现不同设备上的排版和布局。同时，使用媒体查询来设置不同的显示和隐藏。在组件方面，Bootstrap提供了许多常用的组件，如按钮、导航栏、轮播图和表格等，通过添加不同的class来设置不同的样式和功能。 第三，介绍了Bootstrap内置的插件。通过添加class和实现JavaScript的初始化，可以实现一些常用的插件功能，如弹窗和下拉菜单等。另外，Bootstrap还对HTML5和CSS3提供了支持，提供了一些元素和属性的默认样式和效果，同时使用了CSS3的一些新特性来实现更酷炫的效果。此外，Bootstrap还支持LESS动态样式，LESS是一种CSS预处理语言，可以编写更优雅、可复用和易于维护的CSS代码，通过定义变量、嵌套、混合和函数等特性，使样式表更具可读性和可维护性。 最后，介绍了Vue.js。Vue.js是一种渐进式框架，用于构建用户界面。通过组件化的方式构建用户界面，实现了数据和视图的双向绑定。通过指令来实现DOM操作和事件绑定，通过路由来实现单页面应用的页面切换。Vue.js是前端开发中非常重要的一项技术，能够极大地提高开发效率和用户体验。 综上所述，前端Bootstrap Es6 vue学习笔记囊括了前端开发的关键技术，包括基础环境配置、样式排版、响应式布局、组件、内置插件、HTML5 CSS3支持、LESS动态样式和Vue.js等。通过学习这些技术，我们可以更好地进行前端开发，开发出适配不同设备的响应式网页，提升用户体验。