林林一928-CSDN博客

原创 BootStrap入门到实战：BootStrap组件（三）- 分页、标签、徽章、巨幕、页头与缩略图

一、分页1. 默认分页、2. 尺寸、3. 翻页、4. 对齐链接、5. 可选的禁用状态。二、标签。三、徽章。* 扩- 标签与徽章的使用区别。四、巨幕。五、页头与缩略图。 1. 页头。 2. 缩略图。2.1 默认样式的缩略图。 2.2 自定义内容。 2.3 缩略图的用途。 2.4 缩略图在日常开发中的作用

2024-06-09 18:06:43 1225

原创 BootStrap入门到实战：BootStrap组件（二）- 输入框组、导航、导航条、路径导航（面包屑效果）

导航标签用于在网页上创建各种风格的导航栏，包括水平标签页、胶囊式标签页、垂直堆叠的胶囊式标签页、两端对齐的胶囊式标签页、禁用的链接以及带下拉菜单的标签页。bootstrap的导航条是一个高度可定制的界面组件，它不仅支持丰富的界面元素配置，还提供了灵活的空间布局策略。在实际运用场景中，输入组（Input Group）在Bootstrap框架中主要用于提高表单的可读性和用户友好性，通过将相关控件组合在一起，为用户提供更直观、更易于操作的表单体验。添加相应的尺寸类，其内部包含的元素将自动调整自身的尺寸。

2024-06-04 08:58:47 920 3

原创 BootStrap入门到实战：BootStrap组件（一）- Glyphicons字体图标、下拉菜单、按钮组、按钮式下拉菜单

一、Glyphicons字体图标二、下拉菜单用于显示链接列表的可切换、有上下文的菜单。下拉菜单的 JavaScript 插件让它具有了交互性用jQuery实现1.3 菜单向上弹出2. 对齐.默认情况下，下拉菜单自动沿着父元素的上沿和左侧被定位为 100% 宽度。为 .dropdown-menu 添加 .dropdown-menu-right 类可以让菜单右对齐3.对齐4.分割线5.禁用的菜单项三.按钮组。四.按钮式下拉菜单，1. 单按钮下拉菜单，2. 分裂式按钮下拉菜单...

2024-06-03 20:31:46 1270 7

原创 BootStrap入门到实战：BootStrap全局CSS样式（三）- 表格、表单、按钮、图片、辅助类

一. 表格1.基本表格2.带边框的表格3.条纹状表格4.鼠标悬停时作出响应的表格5.紧缩表格6. 状态类7. 响应式表格。二.表单1.基本实例2.水平排列的表单3.内联表单4.被支持的控件4.1输入框4.2文本域4.3多选4.4 单选5.表单状态5.1焦点在状态5.2禁用状态5.3只读状态5.4效验状态5.5控制尺寸三.按钮1.可作为按钮使用的标签或元素2. 预定义样式3. 尺寸4. 禁用状态四.图片 1.响应式图片2.图片形状五.辅助类 1.情景文本颜色2.情景背景色3.关闭按钮4.三角符号

2024-05-19 13:56:53 1297

原创 BootStrap入门到实战：BootStrap全局CSS样式（二）- 文本排版和样式设置、 HTML5特殊文本标签的应用

在使用Bootstrap框架时，可以通过结合使用这些HTML标签和Bootstrap的样式类，来增强页面的视觉效果和用户体验。例如，可以使用Bootstrap的排版和颜色类与这些标签结合，以创建更吸引人的代码示例、用户输入提示、代码块展示等。该内容并不直接属于Bootstrap框架的具体内容，而是HTML5中的一些标签元素，它们用于表示特定类型的文本内容，如代码、键盘输入、预格式化文本等。内容涵盖了标题、副标题、文本对齐、大小写转换、文本修饰以及缩略语等方面的样式设置。通过这几个类可以改变文本的大小写。

2024-05-17 17:36:00 1122

原创 BootStrap入门到实战：BootStrap全局CSS样式（一） - 栅格系统基础与栅格系统属性

BootStrap容器。布局容器:Bootstrap 需要为页面内容和栅格系统包裹一个 .container 容器。我们提供了两个作此用处的类。.container 类用于固定宽度并支持响应式布局的容器.container-fluid 类用于 100% 宽度（近似100%，并不是完全100%），占据全部视口（viewport）的容器.Bootstrap 提供了一套响应式、移动设备优先的流式栅格栅格系统属性1. 删除网格间距2. 列偏移3. 嵌套列

2024-05-14 14:08:38 917 1

原创 BootStrap入门

BootStrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目,BootStrap 针对响应式布局的项目。下载并引入BootStrap，测试BootStrap是否引入成功。

2024-05-12 13:19:25 908 1

原创 JavaScript学习之DOM模型概念

DOM是浏览器提供一套专门用来操作网页内容的功能。JavaScript分为: 1. ECMAScripts(javaScripts语言基础)2.Web APIs: 2.1 DOM(页面文档对象类型)2.2 BOM(浏览器对象模型)。节点（node）：DOM 的最小组成单位。一个文档的所有节点，按照所在的层级，可以抽象成一种树状结构。这种树状结构就是 DOM 树。Node.nodeType属性

2024-04-21 10:10:12 795 1

原创 JavaScript学习之 Element对象_获取元素位置

Element对象_获取元素位置：1. clientHeight, clientWidth。2. clientLeft,clientTop。3. scrollHeight,scrollWidth。4. scrollLeft,csrollTop。 5. offsetHeight,offsetWidth。 6. offsetLeft,offsetTop。（附：视口高度，页面总高度）

2024-04-20 17:51:59 1717

原创 JavaScript学习之Element对象_属性

JavaScript学习之Element对象_属性:1. Element.id; 2. Element.className; 3. Element.classList; 4. Element.innerHTML; 5. Element.innerText; 附：操作表单元素属性表单有许多情况，也需要修改属性，如：在登录页时，密码框可以显示密码和隐藏密码，本质上是将密码框转与文本框相互转换。不能使用input.innerHTML来获取值，因为input标签没有innerHTML属性,所以得不到表单的内容

2024-04-18 17:50:16 950 6

原创 JavaScript学习之document对象-获取元素方法

讲述document对象获取元素的方法：document.querySelector()， document.querySelectorAll()， document.getElementsByTagName()，document.getElementsByClassName()， document. getElementsByName()， document.getElementById()

2024-04-16 18:09:03 1629 3

原创常用的jQuery基本过滤选择器：:eq()、:even()、:odd()、:first()、:last()、:gt()、:lt()用法

:eq()、:even()、:odd()、:first()、:last()、:gt()、:lt()用法总结

2024-04-13 16:36:52 388 2

林林一928的博客