随笔分类 - html\css
摘要：方式一：值相加 我们先去MDN看看官方的解释： 优先级是如何计算的？优先级就是分配给指定的 css 声明的一个权重，它由 匹配的选择器中的 每一种选择器类型的 数值 决定。 而当优先级与多个 css 声明中任意一个声明的优先级相等的时候，CSS 中最后的那个声明将会被应用到元素上。 当同一个元素有多
阅读全文
摘要：按钮（button）可能是网页中最常见的组件之一了，大部分都平淡无奇，如果你碰到的是一个这样的按钮，会不会忍不住多点几次呢？ 通常这类效果第一反应可能就是借助canvas了，比如下面这个案例（建议去codepen原链接访问，segmentfault内置的预览js会加载失败） 效果就更加震撼了，当然c
阅读全文
摘要：1、先讲结论 border-radius 这个 css 属性大家应该使用得非常娴熟，现实中用到的场景基本都是四个圆角一致的情况。 比如实现一个圆形按钮，其中 border-radius 数值有些人写为 50%，有些人则写成 100%，不过你会发现两者效果是一样的： 测试 html 代码如下： <st
阅读全文
摘要：html5中的video标签用于播放视频文件的，在video标签中我们可以设置窗口的宽高，视频的自动播放，循环播放以及视频的封面图片等等 html5是下一代HTML，新增了许多新的标签，这些标签实现了许多新的功能。并且还减少了对外部插件的要求同时也可以更好的处理错误。比如HTML5中的video标签
阅读全文
摘要：CSRF绕过后端Referer校验分正常情况和不正常的情况，我们这里主要讨论开发在写校验referer程序时，不正常的情况下怎么进行绕过。 正常情况 正常的情况指服务器端校验Referer的代码没毛病，那么意味着前端是无法绕过的。 我之前考虑过的方案： js修改Referer，失败； 请求恶意网页后
阅读全文
摘要：动画是使元素从一种样式逐渐变化为另一种样式的效果。您可以改变任意多的样式任意多的次数。请用百分比来规定变化发生的时间，或用关键词 "from" 和 "to"，等同于 0% 和 100%。 css3的animation直接提供一个animation-play-state的样式来控制动画的暂停处理。增加
阅读全文
摘要：css让图片铺满的方法：可以使用background-size:cover样式设置背景图片铺满。background-size属性规定背景图像的尺寸。 豌豆资源搜索网站https://55wd.com 广州vi设计公司http://www.maiqicn.com 豌豆资源搜索网站https://55
阅读全文
摘要：单进程问题 不稳定，插件崩溃浏览器就崩溃 不流畅，脚本执行会让页面卡顿，内存泄漏也会导致浏览器变慢 不安全，恶意插件和恶意脚本容易获取系统权限作恶 多进程优点 进程隔离，插件或者页面崩溃不会导致其他页面崩溃 页面隔离，即使 js 阻塞了渲染进程，影响到的也只是当前的渲染页面，而并不会影响浏览器和其他
阅读全文
摘要：很多时候，我们在项目开发中会出现，单元格内容由于太多导致的换行问题，让表格显得非常的丑陋。下面我们来看一下使用css设置表格内文字不换行的方法。 vi设计http://www.maiqicn.com 办公资源网站大全https://www.wode007.com css可以通过为表格table与td
阅读全文
摘要：在css的学习过程中，我们会遇到一些属性可以继承，那么，css中的继承是什么意思？有哪些属性可以继承呢？下面我们来看一下css中的属性有哪些可以继承。 豌豆资源搜索网站https://55wd.com 广州vi设计公司http://www.maiqicn.com css中有继承性的属性： 1、字体系
阅读全文
摘要：Scss是Sass3版本当中引入的新语法特性，完全兼容css3的同时继承了Sass强大的动态功能。scss文件可以编译为css文件，下面我们来看一下将scss编译为css的方法。 我们可以使用node来将scss编译为css。下面我们来看一下使用node将scss编译为css的方法。 使用nodej
阅读全文
摘要：在网页制作中，很多时候都会有箭头的情况，我们可以使用css来绘制箭头，css是如何绘制箭头的呢？下面我们来看一下使用css绘制箭头的方法。 我们可以使用css绘制三角形来制作箭头。 一、绘制三角 html代码： <div></div> css代码： .container{ width: 0; hei
阅读全文
摘要：代码引用阿里巴巴iconfont svg图标时发现，设置颜色后，有一部分图标还是显示原始的颜色。原来这部分 svg图标带有 fill 属性，这种图标不能本地修改 fill 属性，需要在项目中移除默认颜色。 svg图标 带有 fill 属性，如果选择的是多色图标且下载到本地的话，默认是带有颜色的。 修
阅读全文
摘要：最近在写页面的时候，需要在左上角加一个logo，但是复制的时候会把这张图片一块选中。 那么我们可以通过css给它设置禁止选中，代码如下： .icon { -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none;
阅读全文
摘要：什么是绝对路径？ 绝对路径指的是文件的真正路径，使用绝对路径链接外部资源，如：图片、超级链接、flash、音频、视频等等。代码如下： 1、引入网络上的资源： <img src="http://完整的URL描述地址"> 2、引入电脑本地的绝对路径，如D盘下images文件夹里名称为“aaa.jpg”的
阅读全文
摘要：object-fit: 指定可替换元素的内容应如何适应到需使用的高度和宽度确定的框 平时写代码经常会在代码中插入图片，你是否会多少感觉插入的图片被拉伸或是被缩放，在这里我们就探讨object-fit对图片处理的应用 语法及作用 fill (充满) 整个对象将完全填充内容框。当对象的宽高与内容框不匹配
阅读全文
摘要：最近，我从 Grover网站 上发现以一个好玩儿的悬停动画，这个动画是将鼠标移动到订阅按钮上移动光标，会跟随光标实现相应的彩色渐变。 这个想法很简单，但是它能使这个按钮脱颖而出，人们一下子就注意到它了，增加了点击的概率。 怎样才能达到这个效果，使我们的网站脱颖而出呢？其实，它并不像我们想象的那么难！
阅读全文
摘要：介绍 事件流描述的是从页面中接收事件的顺序。但是IE和Netscape却提出了两个完全相反的事件流，分别是事件冒泡流和事件捕获流。 事件冒泡 IE的事件流称为事件冒泡，从最具体的元素开始，然后逐渐向上传播到文档节点。如下图： 我们以下面代码展示事件冒泡： <!DOCTYPE html> <html>
阅读全文
摘要：a标签的 href 属性用于指定超链接目标的 URL，href 属性的值可以是任何有效文档的相对或绝对 URL（路径），包括片段标识符和 JavaScript 代码段。 JavaScript: 是表示在触发默认动作时，执行一段JavaScript代码，而 javascript:; 表示什么都不执行，
阅读全文
摘要：<video> 标签定义视频，比如电影片段或其他视频流，可以放置视频资源，并添加视频控件。 支持的浏览器： Internet Explorer 9+, Firefox, Opera, Chrome 以及 Safari 支持 <video> 标签。 注：Internet Explorer 8 以及更早
阅读全文
浙公网安备 33010602011771号