- 博客(21)
- 收藏
- 关注
RSS订阅原创 JavaScript中splice方法的使用
JavaScript中splice方法的使用splice的基本用法删除操作插入操作替换操作splice一次性删除多个元素splice的基本用法在JavaScript中，arrObject.splice()方法是处理数组的利器，利用它可以实现在指定位置删除、替换、插入指定数量的元素。其语法为： arrayObject.splice(index,howmany,item1,…,itemX)含义为从index开始，删除howmanry个元素,并在原地插入item1, …, itemN，最后返回被删除的数组
2021-03-08 14:02:17
1752
1
原创 4 Bootstrap4组件——卡片
4 Bootstrap4组件——卡片1 卡片内容1.1 卡片标题1.2卡片主体1.2.1 文本1.2.2 超链接1.3 图片1.4 列表组1.4.1 基本结构1.4.2 列表标题1.4.3 列表页眉页脚2 响应式卡片2.1 使用栅格系统2.2 使用全局样式2.3 自定义样式.card卡片组件是BootStrap 4新增的一组重要样式，它是一个灵活的、可扩展的内容管理器，可以包含图片、列表、文本、...
2020-03-17 17:41:16
2978
1
原创 4 Bootstrap4组件——按钮和按钮组
4 Bootstrap4组件——按钮和按钮组1 按钮1.1 按钮的样式1.2 按钮标签1.3 轮廓按钮1.4 按钮的尺寸1.5 按钮的状态1.6 切换按钮2 按钮组1 按钮使用Bootstrap的自定义按钮样式，并广泛用于表单、对话框等场景中的操作，并支持多种大小、状态等一系列变量定义。1.1 按钮的样式Bootstrap包括多个预定义的按钮样式，每个样式都有自己的语义目的，另外还有一些额...
2020-03-17 14:44:55
2593
原创 4 bootstrap4组件——面包屑导航
4 bootstrap4组件——面包屑导航1、基本结构2、更改分隔符在通过BootStrap的内置CSS样式，自动添加分隔符、并呈现导航层次和网页结构，从而指示当前页面的位置为访客创造优秀用户体验。1、基本结构使用.breadcrumb设置一个层次导航。<nav aria-label="breadcrumb"> <ol class="breadcrumb"> ...
2020-03-17 13:45:40
2374
原创 4 Bootstrap4组件——警告提示框（alert）
4 Bootstrap4组件——警告提示框（alert）1 警告框样式1、基础样式2、内部超连接颜色3、额外附加信息2 警告框组件1、使用`data-dismiss="alert"`2、使用脚本警告提示框组件通过提供一些灵活的预定义消息，为常见的用户动作提供常见的上下反馈消息和提示。1 警告框样式1、基础样式警告框是一组颜色控件（共八个颜色样式），可用于任何长度的文本，以及可选的关闭按钮，...
2020-03-17 12:36:43
4939
原创 Bootstrap4样式之flex样式
1、开启Flex布局样式使用.d-flex和.d-inline-flex实现开启flex布局样式，也可以使用.d-[sm|md|lg|xl]-*之前再不同屏幕开启flex布局样式<div class="d-flex"> <div class="p-2 border border-success w-25">项目1</div> <div class=...
2020-03-17 10:59:14
2407
原创 Bootstrap4样式之工具类
Bootstrap4样式之工具类1 构建关闭按钮2 实现浮动3 隐藏标签元素4 设置区域溢出的显示5 设置元素可见与不可见6 设置内容对齐方式7 设置内边距8 设置外边距。9 设置元素尺寸10 设置元素最大最小尺寸为100%11 设置元素阴影效果12 设置元素的display模式13 设置文本的对齐方式14 设置文本溢出换行15 设置字母大小写16 设置字体样式17 删除超链接下划线1 构建关闭...
2020-03-11 19:52:39
1933
1
原创 Bootstrap4的栅格布局
Bootstrap4栅格布局1 栅格容器2 栅格布局的步骤3 声明列3.1 设置列宽3.1.1 平均分配栅格3.2.2 指定列宽3.2.3 可变的列宽3.3 列拆分3.3.1 自动拆分3.3.2 手动拆分3.3.3 响应式拆分3.4 列排序3.5 列偏移Bootstrap架构内置了一套响应式网格的布局系统，网格布局实际上就是把网页分成一定数量的栏数或者叫做网格，Bootstrap4的网格系统就是...
2020-03-04 18:28:37
4985
原创 4 Bootstrap4组件——徽章（Badges）
4 Bootstrap4组件——徽章（Badges）4.1 各种颜色类型的徽章4.2 胶囊徽章徽章（Badges）主要用于突出显示新的或未读的项。如需使用徽章，只需要将 .badge 类加上带有指定意义的颜色类 (如 .badge-secondary) 添加到 <span> 元素上即可。 徽章可以根据父元素的大小的变化而变化：代码：<h1>Example headin...
2020-02-29 12:14:21
1985
原创 3 Bootstrap4样式
3 Bootstrap4样式3.1 文本1、标题2、内联文本元素3、文本对齐方式4、英文大小写3.2 列表3.3 表格1、表格样式2、响应式表格3、状态类3.4 图片1、图片的样式2、缩略图处理3、图片对齐处理4、响应式图片3.5 公共样式3.5.1 边框1、基本边框2、清除边框3、边框颜色4、圆角边框3.6 表单3.6.1 表单布局1、基础表单样式2、行内表单3、水平表单3.6.2 复选框样式1...
2020-02-29 11:34:23
2546
原创 2 Bootstrap4的基本架构
2 Bootstrap的基本架构2.1 响应开发技术2.2 Bootstrap的栅格布局2.2.1 布局原理2.2.2 自动布局列1、等宽布局 （.col）2、等宽多行 (.w-100)3、设置一列宽度4、可变宽度的弹性空间2.2.3 布局对齐1、水平对齐2、垂直对齐2.2.4排序和偏移1、排序2、偏移2.1 响应开发技术1、响应式开发的概念响应式网站是指可以兼容不同的终端，如笔记本电脑、...
2020-02-29 10:58:45
2342
原创 1 Bootstrap 4起步
1 Bootstrap 4起步1.1 Bootstrap４ 介绍1.2 Bootstrap４ 的构成1.3 Bootstrap4的下载1.4 BootStrap的基本模板1.1 Bootstrap４ 介绍BootstrapBootstrap是stwitter公司的两名前端设计师设计的， 全球最受欢迎的前端组件库，用于开发响应式布局、移动设备优先的 WEB 项目。Bootstrap 是一个用于...
2020-02-29 10:35:36
1863
原创 CSS清除浮动的技巧
选择卡Tab排版目录1 浮动产生的原因2 浮动的负影响3 清除浮动的方法1 浮动产生的原因一般是一个盒子里使用了CSS的float浮动属性，导致父级对象盒子不能被撑开，这样CSS的float浮动就产生。了。HTML代码：<div class="box"> <div class="box_left">left</div> <div class=...
2019-12-28 16:17:44
1455
原创 选择卡Tab排版
选择卡Tab排版目录1 选项卡切换原理2 编写HTML文件3 编写CSS样式4 编写JS脚本1 选项卡切换原理选项卡切换包括2项关键技术：1、选项卡标签项与选项卡内容项的关联实现关联最简单的办法是建立HTML结构时就使选项卡标签项与选项卡内容项的顺序一一对应，当触发第n个选项卡标签时，就切换第n个选项卡内容区可见。2、选项卡内容项的隐藏控制显隐控制的基本逻辑是显示时添加定义displa...
2019-12-05 10:53:43
1535
原创 CSS绘制三角形图标
1CSS绘制三解形图标原理对内容容器进行相对定位，对内容容器的伪元素:before和:after进行绝对定位，设置top、right、bottom、left来控制三角形的绘制位置，设置伪元素:before和:after的宽高均为0，并定义上右下左边框样式，此时上右下左的边框线变成了4个三角形，通过设置某些边的边框颜色透明实现三角形隐藏，从而实现三角形图标的绘制。2 HTML结构<!DO...
2019-12-05 10:25:03
1567
原创 列表排版
列表排版目录1 列表类型1.1无序列表1.2 有序列表1.3 自定义列表2 列表相关样式2.1 list-style-type属性2.2 list-style-image属性2.3 list-style-postion属性3 新闻列表的实现3.1 编写HTML文件3.2 编写CSS样式1 列表类型HTML定义了有序列表（ol）、无序列表（ul）和定义列表（dl）三种不同的列表类型。有序列表为每...
2019-12-05 09:27:26
2151
原创 轮播图排版
1 编写HTML文件<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>美丽的校园</title> <link rel="stylesheet" href="css/carousel.css" /> <script sr...
2019-12-05 09:23:51
2063
1
原创 图片排版
图片排版目录1 CSS图像风格样式1.1 圆角图片1.1.1 图片效果1.1.2 样式定义1.2 圆形图片1.2.1 图片风格1.2.2 样式定义1.3 简单白色框架图片1.3.1 图片效果1.3.2 样式定义2 叠加样式图片标题排版2.1 叠加式图片标题效果2.2 HTML文档2.3 CSS样式1 CSS图像风格样式1.1 圆角图片1.1.1 图片效果1.1.2 样式定义.img-r...
2019-12-04 17:24:26
1886
原创 CSS命名规范
CSS命名规范目录样式文件命名规范CSS命名规范样式文件命名规范全局样式 reset.css框架布局 layout.css外观样式 base.css页面样式 page.css打印样式 print.cssCSS命名规范CSS样式名说明wrapper页面外围控制整体布局宽度container或content容器，用于最外层layout...
2019-12-04 15:38:46
1478
原创 响应式页面排版
1 响应式布局概述新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入响应式网页设计（Response Web D...
2019-12-03 08:47:57
1692
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人