未定义
小目标。成长为一名合格的前端工程师
CodeDoge
学习vue,app开发的菜鸡
展开
-
提示文件过大无法复制到U盘怎么解决
首先普及一个知识,U盘一般会有文件系统,主要有NTFS、FAT16、FAT32三种形式,三种形式对应单个文件的大小也是不一样的,分别如下:NTFS:最大文件2TBFAT16:最大文件2GBFAT32:最大文件4GB一般U盘默认的是FAT32,今天我们主要考虑将U盘设置成NTFS,以便解决上述问题。1、cmd打开管理员面板2、 在弹出的对话框中,输入’convert g:/fs:ntfs’并回车确定。(这边g:/代表U盘所在盘符,根据电脑中U盘实际显示盘符正确输入盘符)3、 回车后,我们会看到原创 2021-04-01 10:21:11 · 1650 阅读 · 0 评论 -
select 下拉框样式修改 option文字居右
select { direction: rtl; /*Chrome和Firefox里面的边框是不一样的,所以复写了一下*/ border: solid 1px #000; /*很关键:将默认的select选择框样式清除*/ appearance:none; -moz-appearance:none; -webkit-appearance:none; /*在选择框的最右侧中间显示小箭头图片*/ /* background: url("h原创 2021-08-03 14:52:58 · 632 阅读 · 0 评论 -
前端菜鸡对2020年回顾
1,2020年买了服务器,域名。简单的上传了两个工具页面http://www.codedoge.top/color/ 拾色板http://www.codedoge.top/time/ 大圣老师的壁纸但是接下来的时间,这台服务器就被我荒废了,没再做什么。对2020年的自己不满意。就说说我自己接下来想做的事吧。node.js 这个必须滴要去学习小程序 app 要独立各做一个vue尤大佬,做为主要的, react 和angular也是要去了解目前自己是技术阶段学习。像原创 2021-01-15 15:57:49 · 186 阅读 · 0 评论 -
图片的1px间隙、字间距、文字竖排 _CSS
日常css1、字间距a、text-indent设置抬头距离css缩进text-indent: 20px; b、letter-spacing来设置字与字间距_字符间距离。 该属性将指定的间隔添加到每个文字之后,但最后一个字将被排除在外。letter-spacing: 8px;c、letter-spacing和word-spacing之间的区别letter-spacing添加字母之间的空白,而word-spacing添加每个单词之间的空白。请大家注意,word-spacing对中文无效。原创 2020-10-23 10:02:59 · 904 阅读 · 1 评论 -
【超实用】又不花里胡哨的鼠标滑过样式
【超实用】又不花里胡哨的鼠标滑过样式来源 | juejin.im/post/6881429197542785031作者@kuangyaoqian一、纯图片的DIVhtml代码(以下效果皆围绕这个代码展开)<div class="lists"> <a href="#" class="box"> <img src="avatar.jpg"> </a> <a href="#" class="box">转载 2020-10-12 16:10:12 · 278 阅读 · 1 评论 -
禁止F12,禁止Ctrl+s,禁止ctrl+u,禁止选中文字,禁止鼠标右键
1、实现禁止选中文字。<script>//网站禁止选择文字 document.body.onselectstart = function() { self.event.returnValue=false};</script>2、实现禁止鼠标右键。<script> //网站禁止右键 document.body.oncontextmenu = function() { self.event.returnValue=fals原创 2020-10-09 11:34:56 · 924 阅读 · 2 评论 -
页面的加载过程
浏览器加载和渲染html的顺序IE下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时进行的。在渲染到页面的某一部分时,其上面的所有部分都已经下载完成(并不是说所有相关联的元素都已经下载完)。如果遇到语义解释性的标签嵌入文件(JS脚本,CSS样式),那么此时IE的下载过程会启用单独连接进行下载。样式表在下载完成后,将和以前下载的所有样式表一起进行解析,解析完成后,将对此前所有元素(含以前已经渲染的)重新进行渲染。JS、CSS中如有重定义,后定义函数将覆盖前定义函数。原创 2020-10-08 15:03:58 · 218 阅读 · 0 评论 -
HTML页面加载和解析流程
HTML页面加载和解析流程用户输入网址(假设是个html页面,并且是第一次访问),浏览器向服务器发出请求,服务器返回html文件。浏览器开始载入html代码,发现标签内有一个标签引用外部CSS文件。浏览器又发出CSS文件的请求,服务器返回这个CSS文件。浏览器继续载入html中部分的代码,并且CSS文件已经拿到手了,可以开始渲染页面了。浏览器在代码中发现一个标签引用了一张图片,向服务器发出请求。此时浏览器不会等到图片下载完,而是继续渲染后面的代码。服务器返回图片文件,由于原创 2020-10-08 15:01:46 · 148 阅读 · 0 评论 -
如何加快HTMl页面记载速度!
1. 页面减肥:a. 页面的肥瘦是影响加载速度最重要的因素。b. 删除不必要的空格、注释。c. 将inline的script和css移到外部文件。d. 可以使用HTML Tidy来给HTML减肥,还可以使用一些压缩工具来给JavaScript减肥。2. 减少文件数量:a. 减少页面上引用的文件数量可以减少HTTP连接数。b. 许多JavaScript、CSS文件可以合并最好合并,人家财帮子都把自己的JavaScript. functions和Prototype.js合并到一个base.js文件原创 2020-10-08 14:51:48 · 148 阅读 · 2 评论 -
html+css实现自定义图片上传按钮
直接上代码效果图<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>自定义图片上传按钮</title> <style> .btn{原创 2020-10-07 16:10:32 · 407 阅读 · 1 评论 -
那些总记不住的css,而且还经常用到
那些你总是记不住但又总是要用的css一、设置input 的placeholder的字体样式input::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: red;}input::-moz-placeholder { /* Firefox 19+ */ color: red;}input:-ms-input-placeholder { /* IE 10+ */ color: red;}i原创 2020-10-07 15:35:20 · 164 阅读 · 0 评论 -
一行代码全站进入悼念模式
一行代码全站进入悼念模式巧妙使用filter这个强大的CSS属性。直接上代码!html { filter:grayscale(1);}一行代码全站进入暗黑模式。(黑暗模式很难看,不推荐使用 0.0)html { filter: invert(1) hue-rotate(180deg);}写完就溜,拜拜,下次见...原创 2020-09-18 15:34:15 · 229 阅读 · 0 评论 -
border 虚线边框
border 虚线边框border:1px dashed;就是这么简单了原创 2020-09-11 15:21:00 · 14411 阅读 · 1 评论 -
下拉菜单,纯CSS实现
下拉菜单,纯CSS实现简单解释下:只需要设置一个div,然后给他设置两种状态,一种是没有:hover,一种是有:hover。并且在没有:hover的时候设置菜单隐藏就可以了(overflow: hidden;),其余的代码都是简单的盒子模型。话不多说,直接上代码<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=d原创 2020-09-01 15:18:24 · 157 阅读 · 1 评论 -
html5canvas实现动态粒子背景
html5canvas实现动态粒子背景什么是 canvascanvas 是 HTML5 新定义的标签,通过使用脚本(通常是 JavaScript)绘制图形。 标签只是图形容器,相当于一个画布,canvas 元素本身是没有绘图能力的。所有的绘制工作必须在 JavaScript 内部完成,相当于使用画笔在画布上画画。默认情况下, 没有边框和内容。默认是一个 300*150 的画布,所以我们创建了 之后要对其设置宽高。(圈重点)我们可以通过html属性‘width’,‘height’来设置canvas原创 2020-09-01 15:01:48 · 1028 阅读 · 2 评论 -
关于js点击元素平滑滚动到页面指定位置的方法
关于js点击元素平滑滚动到页面指定位置的方法HTML <!-- 点击的元素,直接把要跳转到元素id传进去 --> <li class="hover" onclick="tiao('ct1')">点我</li> <li class="hover" onclick="tiao('ct2')">点我</li> <!-- 跳转到的元素 --> <div style="height: 1000p原创 2020-08-27 09:14:21 · 676 阅读 · 0 评论 -
纯css实现手风琴效果
纯css实现手风琴效果话不多说直接上代码 (图片的话,自己找几张代替就OK)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title>原创 2020-08-27 09:22:43 · 147 阅读 · 0 评论 -
input 的submit的按钮样式总结(解决ios样式改变)
input 的submit的按钮样式总结(解决ios样式改变)nput type=button 按钮设置比如颜色和圆角这样样式的时候,会发现在ios和android手机上渲染出来的效果不一样显示效果:android和预期效果是一样的,而ios的颜色是渐变显示的,圆角也相对较大原因:ios在圆角和颜色属性上有默认的按钮渲染方式解决方法:在你的全局样式或者局部样式加入-webkit-appearance:none即可解决input[type="submit"]{ -webkit-app原创 2020-08-19 16:30:33 · 3056 阅读 · 0 评论 -
PC、移动端公用css
PC、移动端公用css公共样式pc端body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, tab原创 2020-08-19 16:27:25 · 389 阅读 · 1 评论 -
页面head标签中的整理
页面head标签中的整理一:移动端准备工作<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"><meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"><!-- 设置在苹果手机上以应用模式启动时,是否全屏 --><meta name原创 2020-08-19 16:24:52 · 141 阅读 · 0 评论 -
使用after伪元素清除浮动(推荐使用)
使用after伪元素清除浮动(推荐使用) .clearfix:after{/*伪元素是行内元素 正常浏览器清除浮动方法*/ content: ""; display: block; height: 0; clear:both; visibility: hidden; } .clearfix{ *zoom: 1;/*ie6清除浮动的方式 *号只有IE6-IE7执行,其他浏览器不执行*/原创 2020-08-19 16:19:04 · 828 阅读 · 1 评论 -
CSS之动态的渐变色盒子
CSS之动态的渐变色HTMLCSS在写页面的时候总会是按钮块,因个人工作本内容,这些按钮需要很醒目。所以就做了写动态彩色的按钮。直接上代码!HTML/* html /div class="rainbow">彩虹屁</div>CSS这里呢做了一些浏览器的兼容。/* css /.rainbow {width: 200px;height:60px;background: linear-gradient(to right,#ff03da,#ee4474);animation原创 2020-08-12 10:15:43 · 723 阅读 · 1 评论