Bootstrap中自适应布局的一些设置
Boostrap本身就是一个响应式自适应的前端UI框架。使用栅格模式后，其自适应功能也能很好的运用。根据浏览器宽度的大小，Boostrap有四种栅栏类名提供使用，用法与Css样式表类名选择器样式调用是一样的：xs：col-xs-1~col-xs-12，多列始终在一行内。sm：col-sm-1~col-sm-12，多列在浏览器像素宽度大于等于768px时才在一行内。md：col-md-1~col-md-12，多列在浏览器像素宽度大于等于992px时才在一行内。lg：col-lg-1~col-lg-12，多列在浏览器像素宽度大于等于1200px时才在一行内。 &...[>>…]
利用img的usemap属性和css3实现圆形点击区域
css属性实现圆形点击区域有两种方式，一是利用img的usemap属性，二是使用CSS3中相关的border-radius属性。 一、使用img结合map实现。usemap属性提供了一种客户端的图像映射机制，通过特殊的<map>和<area>标签，可以将图片不同的区域映射到不同的链接。示例如下： <!doctypehtml> <htmlclass="notranslate"> <head> <metacharset="UTF-8"/> </head> <bodystyle="padding:100px;"> <imgsrc="test.png"usemap="#cri...[>>…]
Vue开发工具VSCode的安装使用以及nodejs中的npm安装
凭借着免费，开源，轻量，跨平台的特点收货了一大批忠实粉丝，现在使用Vscode作开发IDE的人越来越多，特别是前端开发。VSCode对JavaScript语言、库和Web环境的支持都很好。所有关于react、Vue.js、Electron的教程中也都推荐使用VSCode。 VSCode的安装使用，进入VScode的官网https://code.visualstudio.com/ 点击DownloadforWindows下载安装即可，非常方便。安装完成之后运行IDE进行一下语言选择，有方便的中文语言包支持。方法：使用快捷键:ctrlshift+p打开快速...[>>…]
http请求中的Referrer-Policy策略及应用
在页面调用图片等其它资源时，或者发生页面跳转时，都会向服务端发生一个带Referrer的HTTP请求，这也是一些网站做防盗链的抓手，在ReferrerPolicy策略发面前，浏览器可以按自己的默认规则来决定是否加上Referrer。2014年W3C下Web应用安全工作组（WebApplicationSecurityWorkingGroup）发布了ReferrerPolicy草案，对浏览器发送Referrer做了详细规定。在新的ReferrerPolicy中，可以实现隐藏Referrer，也可以只发送来源URL的host地址（不过不允许伪造）。 新的ReferrerP...[>>…]
Access-Control-Allow-Origin如何同时允许http和https的Origin跨域请求
因为后端在跨域的时候需要前端的cookie信息，因此跨域网站在输出Access-Control-Allow-Origin头信息的时候不能指定为*，但是因为网站请求支持http和https两种方式，而使用不同请求方式的时候传给服务器端的origin头信息内容是不一样的。 如果服务器是直接承接的https请求，443和80端口的配置是分开写的到也好处理，可以直接使用在添加header信息的时候根据当前请求的scheme添加头信息。add_headerAccess-Control-Allow-Origin"$scheme://www.04007.cn"always; &...[>>…]
CORS使用Access-Control-Allow-Origin来允许跨域请求
因为浏览器的同源策略，浏览器只允许请求当前域的资源，而对其他域的资源以不信任的态度处理。JSONP是可以解决跨域的一些问题，但JSONP只支持GET请求而不支持POST，因此还是有限，而使用Access-Control-Allow-Origin可以应对各种跨域请求。 CORS全称跨域资源共享（Cross-originresourcesharing）,这是W3C的标准，即是使用Access-Control-Allow-Origin来允许跨域请求，对这种请求也有标准的处理流程。 对于跨域的请求，浏览器端先向目标服务器...[>>…]
关于http的206状态码和416状态码的意义及断点续传
HTTP2xx范围内的状态码表明客户端发送的请求已经被服务器接受并且被成功处理了,HTTP/1.1206状态码表示客户端通过发送范围请求头Range抓取到了资源的部分数据，一般用来解决大文件下载问题，一般CDN服务器都会支持这种能力。能否支持206只要看服务端响应头信息中是否存在accept-ranges:bytes这种头信息。accept-ranges:bytes表明服务器支持Range请求,以及服务器所支持的单位是字节(这也是唯一可用的单位).Content-Length响应头表明了响应实体的大小,也就是真实的视频等文件的大小，如下即是99...[>>…]
前端请求出现414 Request-URI Too Large问题
某个请求一点开一看，报错414Request-URITooLarge。问题很清楚，就是请求的get数据太多了，MYGOD，这种情况怎么能存在，将这么多数据放在get请求中当参数。好吧，事已至此，只能去解决了。服务端是proxy+nginx+php结构，先得从nginx配置修改开始：client_header_buffer_size128k;large_client_header_buffers4128k;client_max_body_size128m; 一般来讲，幸运的话，改完这个你的问题也就解决了。因为你的请求数据并不是很大，或者直接说没有超过64K改完就能正常。不过...[>>…]
报错Resource interpreted as Stylesheet but transferred with MIME type text/plain的解决
刚刚搭建好一套多服务器及lnmp，但是在安装一套开源产品的时候发现有点问题，从显示上看就是页面显示时感觉css都加载不正常。但是通过源代码查看后点击各css以及js链接文件又能正常访问，也是奇了怪了。忍者就这样把产品安装了，但是在安装完后进入管理页面没法看了。这是什么鬼，于是使用chrome进行了一些审核分析，其它的异常没有，就是有下面几行问题：ResourceinterpretedasStylesheetbuttransferredwithMIMEtypetext/plain:http://test.04007.cn/static-dist/app/css/bootstrap.css?ver...[>>…]
KindEditor编辑器调整插入程序代码下拉框顺序
后台里使用的是KindEditor编辑器，网页中也经常使用代码插入，不过我一直用得多的是shell代码插入，因为主要就是一个单独显示以及着色，很少使用其它的选项，但在Kindeditor编辑器里，后台点击插入程序代码后弹出的框里排序是JavaScript第一，导致我每次都要进行下拉选择，如下位置所示图： 偶尔一次也就算了，但用多了就有点烦这个地方了，于是就到官网上去找设置这里的文档：http://kindeditor.net/docs/option.html但是没有什么收获，看来这里就是写死的东西吧，...[>>…]
