01 2026 档案
摘要:如果介绍HTML网页基本标签的嵌套规则,首先要说的就是元素的分类。元素可以划分为块级元素和行级元素,块级元素是什么?它可以独占一行,可以设置宽高度,默认是100%;行级元素与之相反,它的内容决定它的宽高度,至于特殊字符就当成是文字来看 1 2 3 4 5 6 7 8 9 10 11 12 13 14
阅读全文
摘要:原理为调用 window.print() 方法,但是该方法只能对当前页面全部打印,所以有了以下方案来解决局部打印 1: 利用 iframe 将需要打印的元素和样式注入 再调用打印 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23
阅读全文
摘要:两种方式为:拖拽普通标签位置或拖拽canvas中的文本框位置 1. 实现鼠标拖动标签元素到任意位置 css 代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 #range { position: relative; width: 600px; height: 400
阅读全文
摘要:<marquee>标签,它是成对出现的标签,首标签<marquee>和尾标签</marquee>之间的内容就是滚动内容。<marquee>标签的属性主要有behavior、bgcolor、direction、width、height、hspace、vspace、loop、scrollamount、s
阅读全文
摘要:css样式文件listviewTest.css 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45
阅读全文
摘要:表格如果比较宽,则有可能溢出。 比如有两个div,左和右。如果表格在右边的div中,但是它比较宽,则显示的时候很可能右边的div中没有显示,而是显示在了下边。此时只要规定这个表格的宽度即可: <table style='width:85%'> 解决html表格中内容超出不强制换行和超出宽度自动隐藏并
阅读全文
摘要:众所周知我们写 html 页面经常会在元素上绑定很多属性或者是事件什么的,如果不换行就比较难看,所以我的日常做法是每个属性单独一行,就像这样: 1 2 3 4 5 <nz-pagination [nzPageIndex]="2" [nzTotal]="500" nzShowSizeChanger n
阅读全文
摘要:基本思路 其实就把输入框与后面的图标一起放在一个div里面,然后将输入框的border设置为0px,最后设置div的border为最终的外边框 我们最直接上代码: HTML: 1 2 3 4 5 6 7 8 <div class="search"> <form action="http://baid
阅读全文
摘要:在html中有两种禁用表单提交的方法,他们分别是: 1.给控件标签加上readonly='readonly'属性 2.给控件标签加上disabled='disabled'属性 例如: 1 2 <input type="text" value="" readonly="readonly" /> <in
阅读全文
摘要:需求 用户填写表单,点击保存之后,可以直接下载pdf文档。 解决思路 服务端生成 思路 谷歌浏览器在17年自行开发了Chrome Headless特性,并与之同时推出了 puppeteer,它可以被理解为是无界面但是可以完成服务器功能特性的浏览器。 所以我们可以在服务端启动puppeteer浏览器,
阅读全文
摘要:HTML常见的行内元素有: <span>、<a>、 <img>、 <input>、<textarea>、<select>、<label> 还有包括一些文本元素如:<br> 、<b>、 <strong>、<sup> 、<sub>、 <i> 、<em> 、<del> 、 <u>等。 要是只回答<span
阅读全文
摘要:1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53
阅读全文
摘要:html post请求之a标签的两种用法举例,具体内容如下: 1、使用ajax来发起POST请求 HTML代码如下: 1 <a href="http://www.xuepai.net/" class="a_post">发起POST请求</a> JQuery代码如下: 1 2 3 4 5 6 7 8
阅读全文
摘要:把Element UI里的textarea input设置为autosize之后,文本框的默认高度为33,并不符合设计 默认样式 在浏览器中查检元素,发现 高度是由textarea的height和min-height来控制框内文字的位置是由padding控制尝试 直接修改文本框的height和pad
阅读全文
摘要:1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53
阅读全文
摘要:HTML+CSS+JS模仿win10亮度调节效果 代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44
阅读全文
摘要:页面结构(index.html): _config.scss: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 /*设置颜色及max-width*/ $primary-color: rgba(13,110,139,.75); $overlay-colo
阅读全文
摘要:例: 1 2 3 4 5 6 7 8 9 10 11 <table width="95%" border="1" cellpadding="2" cellspacing="1"> <tr> <td width="50px" nowrap>序号</td> <td width="150px" nowra
阅读全文
摘要:n种方式实现隔行变色 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 5
阅读全文
摘要:html源代码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <ti
阅读全文
摘要:具体实现代码如下,就不细说了。 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48
阅读全文
摘要:如何让你的html button本身居中呢? 这个很好找思路, 在其父标签中设置居中属性啊, 如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 <html> <body> <center><button onClick="myClick()">hit me</button></ce
阅读全文
摘要:HTML设置边框的三种方式 1 2 3 4 border-width: 1px 2px 2px; border-style: solid dashed dotted; border-color:red green blue; /*分别为 上→左右→下 边框设置*/ 1、边框的组成: 1 border
阅读全文
摘要:定义html结构 这里只需要一个 canvas 元素就可以了。 1 2 3 4 5 6 7 8 9 10 <html> <body> <canvas id="myCanvas" width="900" height="600" style="background-color: black;" ></
阅读全文
摘要:源代码展示 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51
阅读全文
摘要:HTML的relative与absolute区别:说实话html这门语言算的上是这个世界上最简单的一门语言了,标签语言嘛,就是标签多了点英文单词超多,不过都是有规律的比如文本类居中text-align:center;加粗text-weight:bold;.但是还是有一些比较难理解掌握标签和属性,就比
阅读全文
摘要:使用html做复杂的表格。复杂表格一般是用到td的两个属性:rowspan 、colspan属性值。 在html中<td> 标签定义 HTML 表格中的标准单元格。 (1)rowspan 属性规定单元格可横跨的行数; (2)colspan 属性规定单元格可横跨的列数。 1 2 3 4 5 6 7 8
阅读全文
摘要:方法一: 原理:通过label标签的关联属性和input的单选类型实现相应div的显示 1.创建一个类名为wrap的div当作容器 2.创建四个label标签,这将作为tab切换项 3.在每一个label中创建一个span标签(导航内容),input标签(实现选中于取消选中)type类型为radio
阅读全文
摘要:HTML代码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 <body> <div class="layui-fluid"> <input type="text" id="txt_id" /> <table class="layui-hide" id="
阅读全文
摘要:很多网站上我们都看到input输入框显示提示文字,让我们一起来看看如果在input输入框中显示提示文字。我们只需要在<input>标签里添加:placeholder="提示文字即可",那么如果要修改提示文字的样式呢?可以这样设置css样式: 1 2 3 4 5 6 7 8 9 10 11 12 13
阅读全文
摘要:在html中如果要把多余的文字显示为省略号,那么有以下几种方法: 单行文本: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8
阅读全文
摘要:1、让父元素生成一个block formating context(块级格式化上下文,可自行百度了解),以下属性可以实现 float: left/right position: absolute display: inline-block overflow: hidden/auto 2、给父元素添加
阅读全文
摘要:当表格头部固定时,需要分为两个表格来做:一部分是thead,一部分是tbody,具体实现方式如下: html代码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34
阅读全文
摘要:如果对table设置table-layer:fixed样式后,发现表格中有一行合并过,其它没有合并的行的列宽会平均化,对列宽的设置会失效。 解决方法: 在tbody前面加 1 2 3 4 5 <col style="width: 100px;"/> <col> <col style="width:
阅读全文
摘要:一个图片链接<img src="" /> 想用js 判断url是否有效如果404 就加载默认的图片路径 1 <img src="xxx" οnerrοr="this.src=默认图地址"/> 图片标签img的 onerror事件 1 <img src="pic.gif" οnerrοr="javas
阅读全文
摘要:用 JS 动态控制的代码如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48
阅读全文
摘要:文本水平居中,还要垂直居中,此时我们写代码如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></
阅读全文
摘要:代码如下所示: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 5
阅读全文
摘要:1、安装 1 cnpm i webpack-plugin -D 2、在webpack.config.json中引用 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 const path = require('path') const
阅读全文
摘要:第一步:创建HTML元素 首先,我们要创建一个HTML5的文档。 1 2 3 4 5 6 7 8 9 10 <!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> </head> <body> </body>
阅读全文
摘要:随着目前前端页面的需求不断提升,有些场景需要渐变背景的元素。本文利用div和css3新属性,实现了一个背景渐变的按钮,具体如下: 1.background: linear-gradient 背景为渐变色属性2.利用css3中动画特性animation,实现背景从左至右变化(color_move)3.
阅读全文
摘要:关于元素的一些属性 在前端的日常开发中,我们经常无可避免的需要获取或者监听一些页面的属性,那么我们需要经常了解一些属性代表的含义才能更好地使用这些属性。特别是一下这些: 尺寸相关:offsetHeight、clientHeight、scrollHeight; 偏移相关:offsetTop、clien
阅读全文
摘要:源码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52
阅读全文
摘要:代码 1 2 3 4 5 6 7 8 9 var _div = document.querySelector('.discuss_area'); var range = document.createRange(); range.selectNodeContents(_div); range.col
阅读全文
摘要:1.HTML概述 1.HTML:超文本标记语言。是一种标识性语言,非编程语言,不能使用逻辑运算。通过标签将网络上的文档格式进行统一,使分散的网络资源链接为一个逻辑整体。 超文本是一种组织信息的方式,通过超级链接将多种媒介链接起来 标记:标签。用<>包裹的具有一定含义的内容,比如:… 静态网页:不变
阅读全文
摘要:完整测试源代码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50
阅读全文
摘要:完整的示例 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51
阅读全文
摘要:链入式是把所有的 样式 放在一个或多个 外部样式表文件 中,这个文件是以 css 为扩展名的,通过 link 标签,将外部样式表(css命名的外部样式文件)链接到html文档中,这样可以把结构和样式分割成2个文件,更能清晰的编辑样式或者结构。 基本语法为: 1 <link rel="styleshe
阅读全文
摘要:一. 引入外部css文件的基本样式 用< link>标签引入外部样式表,其中通常要写两个属性: href属性表示css文件的路径 rel=“stylesheet” 描述了当前页面与href所指定文档的关系.即说明的是,href连接的文档是一个新式表 1 <link href="style.css"
阅读全文
摘要:限制 input 输入框只能输入纯数字 1、onkeyup = "value=value.replace(/[^\d]/g,'')" 使用 onkeyup 事件,有 bug ,那就是在中文输入法状态下,输入汉字之后直接回车,会直接输入字母 2、onchange = "value=value.repl
阅读全文
摘要:完整代码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51
阅读全文
摘要:1. 定义标签,.kapian为最底层盒子,然后两个子盒子一个放图片,一个放文本: 1 2 3 4 5 6 7 8 9 10 11 12 13 <div class="kapian"> <div class="tu"> <img src="3.2.png"> </div> <div class="w
阅读全文
摘要:1.定义导航栏的文字标签: 1 2 3 4 5 6 7 8 9 10 <div class="tou"> <sapn class="logo"> 北极光。</sapn> <ul class="biao"> <li><a href="#"><a href="#">主页</a></li> <li><a
阅读全文
摘要:1、使用HTML和JavaScript播放本地视频文件的示例,源码如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41
阅读全文
摘要:此功能核心思想就是通过 JavaScript 代码控制 node 在页面上的左边距与顶边距,不同的的样式定位方式有不同的解决方案 本方案采用position: absolute定位方式的解决方案 css 样式的核心代码 1 2 3 4 // 父容器核心样式 width: 100%; height:
阅读全文
摘要:代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52
阅读全文
摘要:实现很简单,几行代码 1 2 3 4 5 body{ min-width: 1200px; overflow: scroll; /*max-width:100%;*/ } 知识点扩展: html页面缩小后自动出现滚动条 导入这个style就行了,@ www.xuepai.net主要按需求设置一下bo
阅读全文
摘要:基本html结构 输入 !+Enter 1 2 3 4 5 6 7 8 9 10 11 12 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=dev
阅读全文
摘要:css样式 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51
阅读全文
摘要:1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53
阅读全文
摘要:完整代码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51
阅读全文
摘要:此点名器开始点名后需点击停止按钮完成点名,因为是精简版没有考虑自动停止需求。姓名数据以字符串形式储存,适合小范围点名使用,有大量需求可自己适当改进。 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28
阅读全文
摘要:页面源代码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51
阅读全文
摘要:1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53
阅读全文
摘要:1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53
阅读全文
摘要:下面源代码送上~ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 <!doctype ht
阅读全文
摘要:完整代码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51
阅读全文
摘要:直接上代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51
阅读全文
摘要:1. 定义标签: 1 <h1>aurora</h1> 2. 设置文字基本样式: 1 2 3 4 5 6 7 8 9 10 h1{ text-transform: uppercase; letter-spacing: 3px; font-size: 15vw; transform: rotate(-1
阅读全文
摘要:1.纬度 几个div,设置圆角 2.经度 多条0.5px的边框,通过旋转实现 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 lines: [ { id: 1, transform: "translateX(-
阅读全文
摘要:1.利用transform属性不拉伸显示图片,(路径问题需要按需求修改); html: 1 2 3 <div id="surface-div1"> <img :src="pic1" class="surface-img"> </div> CSS: 1 2 3 4 5 6 7 8 9 10 11 12
阅读全文
摘要:在文本输入中使用占位符,效果很好。但我也想为我的选择框使用一个占位符。当然,我可以使用以下代码: 1 2 3 4 <select> <option value="">Select your option</option> <option value="hurr">Durr</option> </se
阅读全文
摘要:特殊字符对应表 字符 十进制字符编号 实体名字 ! ! 惊叹号Exclamation mark ” " " 双引号Quotation mark # # 数字标志Number sign $ $ 美元标志Dollar sign % % 百分号Percen
阅读全文
摘要:※先初始化(直接复制): 1 2 3 4 5 6 7 8 9 10 11 12 *{ margin: 0; padding: 0; box-sizing: border-box; } body{ height: 100vh; display: flex; justify-content: cente
阅读全文
摘要:代码 html 1 <div class="text">hello,world!</div> css 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36
阅读全文
摘要:下拉菜单HTML代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 <header class="header"> <div class="header_left"> <img src="img/log
阅读全文
摘要:HTML中的下划线曾经是将文本包含在<u></u>标签中的问题,但是这种方法已被放弃,而更倾向于使用更多功能的CSS。一般来说,下划线被认为是引起人们对文本注意的一种方式,那么HTML怎么设置下划线?html文字加下划线方法?下面我们来总结一下。 1.使用“text-decoration”CSS样式
阅读全文
摘要:网上方法 1、html标签 将html显示高度占满(class=“h-100”)。 1 <html lang="en" class="h-100"> 2、body标签设置body弹性布局,并将高度占满(class=“d-flex flex-column h-100”)。 1 <body class=
阅读全文
摘要:获取标签中value的值 使用的javascript获取,所以肯定是包含在< script >标签里的,也需要引入jquery 标签示例: 1 <input id="goodsCount" type="text" size="2" readonly="readonly" class="num-tex
阅读全文
摘要:在浏览器中提交表单后,浏览器一般会提示“是否需要记住密码”,确认后在下次提交表单的时候会自动填充某些输入框。 但是在某些情景下(例如在提现,充值的页面),自动填充密码就很不安全。需要采用一定的手段来阻止浏览器自动填充。 在解决的过程中遇到了一些坑,这里做一下笔记: 使用HTML属性 autocomp
阅读全文
摘要:如果使用 base64 编码的图片在 HTML 的 img 元素中无法显示,可能有以下几个原因: 1、语法错误:img 元素中的 src 属性必须以 "data:" 开头,后面跟着 MIME 类型和 base64 编码的图片数据。如果这个语法格式有误,就无法正常显示图片。 2、MIME 类型错误:如
阅读全文
摘要:Code 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 <div class="container"> <!-- 注册 --> <div cl
阅读全文
摘要:在HTML中,有一种显示布局叫做flex,只要定义一个布局为flex的容器,这个容器的直接子元素就成为flex元素,从而可以模拟上面的双行夹批效果。代码如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 2
阅读全文
摘要:要实现可编辑的 HTML 表格,你可以使用 JavaScript 和 HTML5 的 contenteditable 属性。 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32
阅读全文
摘要:1. 代码解析 在本例中,我们将通过 HTML 和 CSS 实现一个文字镂空的效果,同时加入一个背景图片,使得背景内容能够透过文字显示出来。 HTML 结构 1 2 3 4 5 <body> <div class="mask"> <span class="text">文字镂空效果</span> </
阅读全文
摘要:在前端开发中,禁止HTML页面滚动通常涉及到对CSS样式或JavaScript的使用。以下是一些常见的方法: 1. 使用CSS的overflow属性 你可以通过设置HTML或body元素的overflow属性为hidden来禁止滚动。这会隐藏任何超出元素框的内容,并禁止滚动。 1 2 3 html,
阅读全文
摘要:在HTML中,文本域(textarea)通常允许用户通过拖拽其右下角来调整大小。然而,有时我们可能希望禁止这种手动拖动行为,以固定文本域的大小。要实现这一目标,可以使用CSS的resize属性。 具体步骤如下: 在HTML文件中找到需要禁止拖动的文本域元素(textarea)。 为该文本域元素添加C
阅读全文
摘要:一、Set(集合) 1.1 Set 的基本特性 唯一性:Set 中的每个值只能出现一次,重复的值会被自动忽略。 无序性:Set 中的值没有顺序。 可迭代:Set 支持 for...of 循环和 forEach 方法。 值的类型:Set 可以存储任意类型的值(包括基本类型和引用类型)。 1.2 创建
阅读全文
摘要:1. Array.prototype.some() 方法用法与实例 在JavaScript中, Array.prototype.some() 是一个高阶数组方法,它用于检测数组中是否至少有一个元素满足提供的测试函数。当数组中至少有一个元素通过测试时, some() 方法立即返回 true ;如果没有
阅读全文
摘要:1. 创建 FormData 对象 可以通过构造函数直接创建空的 FormData 对象,或者从 HTML 表单元素初始化: 1 2 3 4 5 6 // 方法1:创建空的 FormData const formData = new FormData(); // 方法2:从 HTML 表单初始化(自
阅读全文
摘要:在 TypeScript 中,export 用于将模块中的变量、函数、类、类型等暴露给外部使用。export 语法允许将模块化的代码分割并在其他文件中导入。 1. 命名导出(Named Export) 命名导出是 TypeScript 中最常见的一种导出方式,它允许你导出多个实体,导入时需要使用相同
阅读全文
摘要:一、!!和!!!的深入理解 1. !!(双重非)操作符 将任意值强制转换为布尔类型,等效于 Boolean() 函数。转换规则: 假值(null、undefined、0、''、NaN、false)→ false 其他值 → true(包括空数组[]、空对象{}、函数等) 典型应用场景: 1 2 3
阅读全文
摘要:什么是 sliced string? V8(Chrome 和 Node.js 使用的 JavaScript 引擎)在处理字符串切片操作时,为了提升性能,不会立即复制子字符串的内容。取而代之的是,它创建了一个引用原始字符串的“切片”(slice),并通过偏移量和长度来标识实际使用的内容。 示例: 1
阅读全文
摘要:如何使用jQuery检查元素是否隐藏 技术背景 在前端开发中,经常需要根据元素的可见性来执行不同的操作。例如,当用户点击一个按钮时,显示或隐藏某个元素,或者根据元素的可见性来加载数据等。jQuery 是一个广泛使用的 JavaScript 库,它提供了多种方法来检查元素的可见性。 实现步骤 1. 使
阅读全文
摘要:第一部分:时区概念的历史演进与现代实现 1. 时区的起源:从地方时到标准时 古代时间计量(公元前1500年-18世纪) 日晷时代:以太阳过中天为“正午”,形成地方太阳时(Local Solar Time) 城市独立计时:每个城市使用自己的钟楼时间(如伦敦当地时间比牛津快5分钟) 铁路时刻表的革命(1
阅读全文
摘要:✅ 实现思路 使用 CSS 定义两种主题样式(亮色和暗色)。 通过 JavaScript 动态切换 HTML 元素的 class 或 data-theme 属性。 使用 localStorage 保存用户选择的主题偏好。 示例代码 🔹 HTML 部分 1 2 3 4 5 6 7 8 9 10 11
阅读全文
摘要:接口在 Vue 3 中的常见应用场景 1. 定义组件 Props 类型 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 // 用户信息接口 interface User { id: number; nam
阅读全文
摘要:1. 页面跳转(最常用) 方法1:window.location.href 1 2 3 4 5 // 跳转到指定URL(会在浏览器历史记录中添加新条目) window.location.href = 'https://www.example.com'; // 等同于: window.location
阅读全文
摘要:一、Vue i18n插件的引入与配置 Vue i18n 是 Vue.js 官方的国际化插件,它允许开发者轻松地将多语言支持集成到Vue应用中。下面我们将详细介绍如何在Vue项目中引入并配置Vue i18n插件。 1. 安装Vue i18n 首先,我们需要在Vue项目中安装Vue i18n插件。可以通
阅读全文
摘要:在VBScript中,你可以使用一个无限循环,并在每次迭代中使用 WScript.Sleep 方法暂停一段时间,然后后续继续执行。 一、创建循环运行的run-everySecond.vbs文件【双击次文件即可启动运行】 1 2 3 4 5 6 7 dim a set a=CreateObject("
阅读全文
摘要:vbs 双引号转义 在 Visual Basic Script (VBS) 中,处理字符串时有时需要包含双引号 (")。由于双引号本身用于定义字符串的开始和结束,因此需要在字符串内部使用它们时进行转义。 双引号的转义方法 在 VBS 中,如果你希望在字符串中包含一个双引号字符,你需要使用两个连续的双
阅读全文
摘要:颜色的原理 最常见的颜色相关的属性就是 color 和 background-color。 颜色值:RGB 颜色,CMYK 颜色,HSL 颜色,其它颜色 RGB 颜色:它符合光谱三原色理论:红、绿、蓝三种颜色的光可以构成所有的颜色。 现代计算机中多用 0 - 255 的数字表示每一种颜色,这正好占据
阅读全文
摘要:Bootstrap 自带以下特性:全局的 CSS设置、定义基本的 HTML 元素样式、可扩展的 class,以及一个先进的网格系统。HTML的基本元素均可以通过class设置样式并得到增强效果。 1、基本设置 (1)使用 HTML5 文档类型。 Bootstrap使用了 HTML5 元素和 Css属
阅读全文
摘要:鼠标悬浮覆盖元素后,以前使用js的mouseover和mouseout添加监听事件可以实现交互。现在可以使用CSS中的:hover选择器提高性能。:hover选择器可以针对不同的HTML元素,在鼠标悬停时改变元素(也可以是子元素、同级元素、就近元素)的样式,增强网页的互动性和用户体验。 定义: :h
阅读全文
摘要:所有HTML元素都可以看作盒子。CSS盒模型本质上是一个盒子,封装周围的HTML元素,它包括:边距,边框,填充,和实际内容。盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。因为Div添加了padding、border,Div的实际宽度=Div的初始固定值+边距值+边框值 盒子模型的组成:
阅读全文
摘要:1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53
阅读全文
摘要:当鼠标悬浮按钮上方时,利用伪元素和定位来实现伪元素块上下滑入和滑出的交互效果。 此效果适用于较大的按钮入口,如主页 banner 处按钮,也可以放在当作首屏当作一个大 banner 作为视觉效果等场景。 核心代码部分,简要说明了写法思路;完整代码在最后,可直接复制到本地运行。 核心代码 html 代
阅读全文
摘要:为什么需要0.5px边框? 设备像素比(DPR)问题: 普通屏幕:1CSS像素 = 1物理像素 Retina屏(如iPhone):1CSS像素 = 2×2物理像素 设计需求:1px逻辑像素在Retina屏上实际显示为2物理像素,线条过粗。 5种实现方案及代码示例 1. transform缩放(最常用
阅读全文
摘要:一、核心区别(一句话) BETWEEN 用来“限定数据的取值范围”,属于过滤条件;LIMIT 用来“限定返回的行数”,属于结果裁剪。 两者解决的问题不同,不能互相替代。 二、语义层面的本质区别 1. BETWEEN(范围条件) 1 WHERE id BETWEEN 10 AND 20 含义: 按 列
阅读全文
摘要:当表中存在 AUTO_INCREMENT 列时,MySQL 在生成自增值的过程中,需要一种机制保证并发插入时不产生重复 ID,这就涉及 自增锁。 这个锁用于 控制自增值分配的顺序和唯一性,而不是保护整行数据。 自 MySQL 5.1 起支持通过参数innodb_autoinc_lock_mode来控
阅读全文
摘要:一、MySQL 复制表(结构+数据)的 4 种核心方法(面试结构化回答) 方法 1:CREATE TABLE ... SELECT ...(最简全量复制) 语法:CREATE TABLE 新表名 SELECT * FROM 原表名 [WHERE 条件]; 原理:一次性创建表结构并插入数据,底层通过全
阅读全文
浙公网安备 33010602011771号