随笔分类 - CSS
摘要：在移动端h5开发的时候，发现如果input在页面底部，当触发input焦点的时候会弹出系统虚拟键盘，虚拟键盘会遮挡input输入框。这会很影响用户体验，于是在网上找到了如下的解决办法： 方法一:使用window.scrollTo() 1 <input type="text" onfocus="inp
阅读全文
posted @ 2020-06-09 18:06
前端一点红
摘要：为一个网站选择类型尺寸是项艰巨的任务. 标题和段落的尺寸在网页布局和可读性方面处理起来很棘手. 谢天谢地, 我们有模块化缩放可以引导我们. 模块化缩放是一个数字序列以某种方式关联另一个序列. Tim Brown,更多版面 在版面中应用的模块化比例实现了视觉层次效果与和谐的比例。它们提供了一组数值作为
阅读全文
posted @ 2020-06-09 17:51
前端一点红
摘要：在做接口测试时，经常会碰到请求参数为token的类型，但是可能大部分测试人员对token，cookie，session的区别还是一知半解。为此我查阅大量的资料做了如下总结。 此篇文章也许是最全最通俗的关于Token ，Cookie和Session的区别的文章，好好揣摩文章的每一个字，也许你会有更深的
阅读全文
posted @ 2020-06-09 17:39
前端一点红
摘要：前言 前端框架时代，为开发体验、效率与页面性能带来，非常大的革命。大家纷纷拿起一系列打包工具(webpack/parcel etc.)，配合一系列加载器快速搭建起一个 SPA 页面。 SPA 应用带来的好处非常明显； 提升页面切换体验 降低切换时间 易于部署&前后端分离 但是也带来一系列性能问题：
阅读全文
posted @ 2020-06-09 17:30
前端一点红
摘要：最近重构了一个项目，一个基于redux模型的react-native项目，目标是在混乱的代码中梳理出一个清晰的结构来，为了实现这个目标，首先需要对项目的结构做分层处理，将各个逻辑分离出来，这里我是基于典型的MVC模型，那么为了将现有代码重构为理想的模型，我需要做以下几步： 拆分组件 逻辑处理 抽象、
阅读全文
posted @ 2020-06-08 17:43
前端一点红
摘要：我们在开发移动端web项目时经常遇到设置border:1px，但是显示的边框却为2px或是3px粗细，这是因为设备像素比devicePixelRatio为2或3引起的。 何为“设备像素比devicePixelRatio” 设备上物理像素和设备独立像素(device-independent pixel
阅读全文
posted @ 2020-06-08 17:22
前端一点红
摘要：meta标签提供关于HTML文档的元数据。元数据不会显示在页面上，但是对于机器是可读的。它可用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 web 服务。 必要属性 属性值描述 content some text 定义与http-equiv或name属性相关的元信息 可选属性
阅读全文
posted @ 2020-06-08 17:13
前端一点红
摘要：微信webview内置了调整字体大小的功能，用户可以根据实际情况进行调节。但是这也会导致字体大小改变以后，出现页面布局错乱的情况。 1、iOS的解决方案是覆盖掉微信的样式： 1 body { /* IOS禁止微信调整字体大小 */ 2 -webkit-text-size-adjust: 100% !
阅读全文
posted @ 2020-06-08 17:04
前端一点红
摘要：htm中doctype标签是一种标准通用标记语言的文档类型声明，它的目的是要告诉标准通用标记语言解析器，它应该使用什么样的文档类型定义（DTD）来解析文档。 dotype 的特点： <!doctype>声明必须处于HTML文档的头部，在<html>标签之前，HTML5中不区分大小写 <!doctyp
阅读全文
posted @ 2020-06-08 17:02
前端一点红
摘要：页面的命名规则 统一用翻译的英文命名（推荐） 统一用拼音命名（拼音的简化也可） 如果文件名过长，企业要提前约定一份缩写的规范，如pro—product 例如： 首页—index 产品列表—prolist产品详细页面—prodetail 新闻列表—newslist新闻详细页面—newsdetail 发
阅读全文
posted @ 2020-06-08 16:57
前端一点红
摘要：我们都知道需要给html和body标签设置了高度height:100%之后，再给内部的div设置height:100%的时候，内部div的高度100%才会起到作用。这是由于：%是一个相对父元素计算得来的高度，要想使他有效，我们需要设置父元素的height。解决如下： 1 html,body{ 2 h
阅读全文
posted @ 2020-06-08 16:43
前端一点红
摘要：一、基本概念 刷新 QQ 空间动态时，发现一则广告，随着用户上下滑动动态列表，就会自动切换广告图片，这样的效果对移动端本就不大的屏幕来说，无疑是很精妙的考虑，这样的效果是怎么实现的呢？ 你可以点击这里：QQ空间广告示意demo 接下来就说说这个效果的具体实现思路： 将两张图片通过定位，相对于图片容器
阅读全文
posted @ 2020-06-08 16:37
前端一点红
摘要：Web开发是比较费神的，需要掌握很多很多的东西，特别是从事前端开发的朋友，需要通十行才行。今天，本文向初学者介绍一些Web开发中的基本概念和用到的技术，从A到Z总共26项，每项对应一个概念或者技术。 A — AJAX AJAX 全称为“Asynchronous JavaScript and XML”
阅读全文
posted @ 2020-06-07 17:17
前端一点红
摘要：目前在移动端安卓手机上使用line-height属性，让它的值等于height，结果发现是不居中的。出现了一定位置的偏移情况，如果略微只有两三个像素差距是看不出来的。 左图中的字号是12px，右图中的行高是26px。仔细观察过上图后，闲话少扯，直接说说我对这个android上line-height问
阅读全文
posted @ 2020-06-07 16:57
前端一点红
摘要：JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式，采用完全独立于语言的文本格式，但是也使用了类似于C语言家族的习惯（包括C, C++, C#, Java, JavaScript, Perl, Python等）。 易于人阅读和编写，同时也易于机器解析和生成。
阅读全文
posted @ 2020-06-07 16:21
前端一点红
摘要：前言： Web前端开发是Web技术发展中的一个重要组成部分，在传统的前端开发中由于外界因素的影响导致其开发形式呈现出简单化的特点，即以页面为主体来展示界面中的信息。然而随着科学技术的不断进步，Web前端开发形式上变得更为复杂，但是其功能方面也逐渐实现了与用户间的相互交流。以下就是对Web前端MVC框
阅读全文
posted @ 2020-06-07 16:16
前端一点红
摘要：我听说很多开发者厌恶 CSS。而在我的经验中，这往往是由于他们并没有花时间来学习 CSS。 CSS 算不上是最优美的『语言』，但迄今二十多年来，它都是美化 web 举足轻重的工具。从这点来说，也还算不错吧？ 尽管如此，CSS 写得越多，你越容易发现一个巨大的弊端。 因为维护 CSS 真是老大难。 特
阅读全文
posted @ 2020-06-07 16:13
前端一点红
摘要：在网页中，如果需要使用辅助性/装饰性的内容的时候，我们不应该直接写在HTML中，这样会影响真正的内容，这就需要使用伪元素了，这是由于css的纯粹语义化是没有意义的。在使用伪元素的时候，会发现js并不真能直接控制它，这篇文章主要就介绍下如果间接的控制、修改css中伪元素的方法。 例如，我的样式表有以下
阅读全文
posted @ 2020-06-07 16:09
前端一点红
摘要：摘要 在各种BS架构的应用程序中，往往都希望服务端能够主动地向客户端推送各种消息，以达到类似于邮件、消息、待办事项等通知。 往BS架构本身存在的问题就是，服务器一直采用的是一问一答的机制。这就意味着如果客户端不主动地向服务器发送消息，服务器就无法得知如何给客户端推送消息。 随着HTML、浏览器等各项
阅读全文
posted @ 2020-06-07 16:06
前端一点红
摘要：在css中使用伪类虽然实现了样式的改变，但由于没有过渡效果会显得很生硬。以前如果要实现过渡，就需要借助第三方的js框架来实现。现在只需要使用CSS3的过渡（transition）功能，就可以从一组样式平滑的切换到另一组样式。 （1）背景色过渡变化 下面鼠标移入后，按钮背景色会慢慢地变成黄色。鼠标离开
阅读全文
posted @ 2020-06-07 15:59
前端一点红
浙公网安备 33010602011771号