随笔分类 - html\css
摘要：bem是基于组件的web开发方法。其思想是将用户界面分隔为独立的块，从而使开发复杂的UI界面变得更简单和快，且不需要粘贴复制便可复用现有代码。BEM由Block、Element、Modifier组成。选择器里用以下连接符扩展他们的关系： `__：双下划线用来连接块和块的子元素 ` ：仅作为连字符使用
阅读全文
posted @ 2020-11-20 14:17
浅笑·
摘要：在诸多的企业尤其是创业型公司中，HR 在招聘时往往希望可以招到一名技术全能型人才，而这种人才又被称之为 全栈开发者，那么对于全栈开发者而言，都需要具备哪些技能？ 以下为译文： 最近，在我参加的一个Web技术会议上，一位开发同事问了我这个问题。这位开发同事遇到的很多新人都自称是全栈开发人员，有点像Bo
阅读全文
posted @ 2020-11-20 14:15
浅笑·
摘要：最近工作中重构了抽奖转盘，给大家提供一个开发转盘抽奖的思路 需求 1、转盘根据奖品数量不同而有变化 2、canvas 目录结构 由于业务需要所以开发了两个版本抽奖，dom和canvas，不过editor.js部分只能替换图片，没有功能逻辑。 需要注意的是此目录隐藏了一个动态数据类(dataStore
阅读全文
posted @ 2020-11-20 14:14
浅笑·
摘要：1.Arachni Arachni是一款基于Ruby框架构建的高性能安全扫描程序，适用于现代Web应用程序。它可用于Mac，Windows和Linux的便携式二进制文件 Arachnin能适用于下面的平台和语言 Windows, Solaris, Linux, BSD, Unix Nginx, Ap
阅读全文
posted @ 2020-11-20 14:12
浅笑·
摘要：随着技术的发展，移动设备越来越流行，并且不同设备间屏幕尺寸和屏幕像素的差异，移动端开发面临着多分辨率适配的问题。 基本概念 响应式开发本质时针对多种屏幕做适配，在实际开发中，通常情况下时针对主流的设备进行适配。在开发前，必须掌握几个基本概念： 物理像素：即屏幕的实际像素点。像素是屏幕设备的最小显示单
阅读全文
posted @ 2020-11-20 14:11
浅笑·
摘要：一、图标的本质 font-awesome图标是字体，专业术语叫 Icon Font，本质上是使用 PUA （ Private Unicode Area ）码位 Unicode 编码的字符，所以font-awesome图标、Bootstrap 的图标和 Wingdings 字体都是一样的，不一样的无非
阅读全文
posted @ 2020-11-20 14:09
浅笑·
摘要：在这篇文章中，我希望能带领大家了解一下 CSS animation property ，以及详细地解释我的个人网站 中的一个效果：让文字在移动的物体后出现。如果你想要看最后的成果，这里有一个 例子 。 我们将从下面这里开始： 这里请查看 Jesper Ekstrom 的 Revealing Text
阅读全文
posted @ 2020-11-20 14:07
浅笑·
摘要：一、变形 transform：可以对元素对象进行旋转rotate、缩放scale、移动translate、倾斜skew、矩阵变形matrix。 示例： transform: rotate(90deg) scale(1.5,0.8) translate(100px,50px) skew(45deg,4
阅读全文
posted @ 2020-11-20 14:03
浅笑·
摘要：一.某个用户向你反映说你开发的网站访问速度很慢，但是该用户访问其他问题很正常，分析下原因、有哪些工具分析原因、怎么解决问题？ （1）可能的原因一：服务器出口带宽不够用。这是一个很常见的瓶颈。一方面，可能是本身购买的服务器出口带宽就很小（企业购买带宽相当昂贵），一旦用户访问量上来了，并发量大了，自然均
阅读全文
posted @ 2020-11-20 14:02
浅笑·
摘要：前端开发过程中，尺寸单位是我们必须用到的，下面我们对css中常见的几种尺寸单位px,em,rem,rpx进行逐一介绍 在这之前，需要先对几个概念进行普及介绍 基本概念 （以下概念读起来可能有些晦涩，如果看不懂也没关系） 像素 它不是自然界的物理长度，指基本原色素及其灰度的基本编码。 css中的像素只
阅读全文
posted @ 2020-11-20 14:01
浅笑·
摘要：一、先来说说XPATH 1、XPATH 概念 XPath 是一门在 XML 文档中查找信息的语言，可用来在 XML 文档中对元素和属性进行遍历。XPath 是 W3C XSLT 标准的主要元素，并且 XQuery 和 XPointer 同时被构建于 XPath 表达之上。因此，对 XPath 的理解
阅读全文
posted @ 2020-10-19 16:59
浅笑·
摘要：css是一门功能强大、具备完整生态的复杂语言。它拥有很多的技巧， 但是生活工作中我们可能不怎么会接触到，这包括一些实际上挺实用的技巧。在此，特地列举一些css里比较容被忽略的小知识，希望能对你有所帮助。 1. 椭圆的实现 跟圆形的实现一样，这里也是用到border-radius属性，但是你可能不知道
阅读全文
posted @ 2020-10-19 16:58
浅笑·
摘要：对于前端基础需要学习哪些内容，之前文章已经有写过不少了，本篇重在谈论： 作为一名前端想要晋升，需要什么条件？现在在用 react，要不要也学学 vue？有必要学习 Node.js/Flutter/ 函数式吗？ 这几个问题看似毫无关联，但是其实它们本质上都是同一个问题，这个问题就是“一个前端工程师到底
阅读全文
posted @ 2020-10-19 16:56
浅笑·
摘要：1、个性化排版设计 最近看到越来越多的网络设计尝试个性化的风格，其中比较突出的一点是个性化字体的增多：用自己独特设计的字体代替标准印刷体，让设计更加独特。让字体在体现个性的同时保留专业印刷风格。 2、扁平化设计 “借壳”设计(skeuomorphism)指模仿现实事物尽可能把手机元素(如图表、背壳等
阅读全文
posted @ 2020-10-19 16:55
浅笑·
摘要：时间进入2019年，我们在网页设计中看到旧有风格的重生，也见证了新的设计趋势的诞生。Web 技术的快速发展，不仅让设计和产品足以满足更多更细致深入的需求，也让设计师能够进行更细腻更独特的表达。现今的网页设计趋势，已经不再仅仅局限于单一的技法，而更多是一种复合的、暗含意图的综合的设计方法。从色彩的选取
阅读全文
posted @ 2020-10-19 16:54
浅笑·
摘要：代码审查的重要性,对码农来说自是不言而喻, 这里记录一次 Code Review的简单纪要，主要以代码审查优化内容为主。 一、Import引入路径 路径尽量使用别名的方式，有效避免相对路径的书写麻烦，以及项目的移植和扩展等。 建议 使用别名，代替使用相对路径。 扩展vue.config.js，比如：
阅读全文
posted @ 2020-10-19 16:52
浅笑·
摘要：html提供了5种空格实体（space entity），它们拥有不同的宽度，非断行空格（ ）是常规空格的宽度，可运行于所有主流浏览器。其他几种空格（       ‌‍）在不同浏览器中宽度各异。 它叫不换行空格，全称No-Br
阅读全文
posted @ 2020-10-19 16:49
浅笑·
摘要：利用伪元素before、after，只创建一个div <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> /*先清掉默认的样式*/ body { margin: 0;
阅读全文
posted @ 2020-10-19 16:48
浅笑·
摘要：我的思路： 1首先，用div元素画6个正方形摞在一起放在画布中间。为了区分，分别给每个div选择了不同的颜色，并且设置为半透明方便透视。2将6个div元素分为三组（上下一组、左右一组、前后一组），想象以画布中心为圆点，使三组分别沿x/y/z轴旋转90度。3上下一组，一张向上推50%正方形边长，一张向
阅读全文
posted @ 2020-10-19 16:47
浅笑·
摘要：小图标icon是一个优秀Web中不可缺少的一部分，起到画龙点睛的效果。在Bootstrap框架中也为大家提供了250多个不同的icon图片。本文将详细介绍Bootstrap图标 原理分析 Bootstrap框架中的图标都是字体图标，其实现原理就是通过@font-face属性加载了字体 @font-f
阅读全文
posted @ 2020-10-19 16:46
浅笑·
浙公网安备 33010602011771号