1、能用css不用js

1、鼠标悬浮展示

     

      

2、自定义radio、checkbox的样式

3、巧用css伪类

当input获取焦点时候，把右边的按钮改变样式

检测用户输入：如果用户输入不合法，将右边的按钮样式置透明度0.5

4、自定义title提示样式

5、伪元素

6、使用伪元素画一条分割线

    

7、After伪类设置清除浮动

8、After伪类禁用input框

9、Css计数器和after伪类

   

10、Css画一个三角形

三角形的画法：

画一个有边缘的三角形：

     

11、css3自适应布局单位 vm, vh

12、CSS 函数

css 性能优化小结的更多相关文章

  1. 第二次讨论——响应式设计、布局技巧、css性能优化、css预处理

    第二次讨论 [响应式设计] 集中创建页面的图片排版大小,可以智能地根据用户行为以及使用的设备环境(系统平台.屏幕尺寸.屏幕定向等)进行相对应的布局. 响应式布局: meta标签的实用:设置布局宽度等于 ...

  2. CSS性能优化的8个技巧

    本文作者:高峰,360奇舞团前端工程师,W3C性能工作组成员,同时参与WOT工作组的学习. 我们都知道对于网站来说,性能至关重要,CSS作为页面渲染和内容展现的重要环节,影响着用户对整个网站的第一体验 ...

  3. Oracle性能优化小结

    Oracle性能优化小结 原则一.注意where子句中的连接顺序 Oracle采用自下而上的顺序解析where子句,根据这个原理,表之间的连接必须卸载其他where条件之前,哪些可以滤掉最大数量记录的 ...

  4. CSS性能优化探讨

    大部分前端开发人员都不关心CSS性能优化,其实对于一个复杂的页面来说,高效的选择器还是可以带来一定的性能提升的. 1. CSS 选择器 浏览器是“从右往左”来分析 class 的,它的匹配规则是从右向 ...

  5. css写作建议和性能优化小结

    1.前言 还有几天就到国庆中秋了,快要放假了,先祝大家节日快乐!之前写过js的写作建议和技巧,那么今天就来聊聊css吧!说到css,每一个网页都离不开css,但是对于css,很多开发者的想法就是,cs ...

  6. webpack 性能优化小结

    背景 如今前端工程化的概念早已经深入人心,选择一款合适的编译和资源管理工具已经成为了所有前端工程中的标配,而在诸多的构建工具中,webpack以其丰富的功能和灵活的配置而深受业内吹捧,逐步取代了gru ...

  7. web前端页面性能优化小结

    影响用户访问的最大部分是前端的页面.网站的划分一般为二:前端和后台.我们可以理解成后台是用来实现网站的功能的,比如:实现用户注册,用户能够为文章发表评论等等.而前端呢?其实应该是属于功能的表现. 而我 ...

  8. WEB前端性能优化小结

    转:http://www.gafish.net/archives/1514 对前端开发工程师来说,前端性能优化的重要性是不言而喻的,最为大家所知的是YSLOW的23条优化规则,在我的理解中,性能优化不 ...

  9. ASP.NET性能优化小结(ASP.NET&C#)

    ASP.NET: 一.返回多个数据集 检查你的访问数据库的代码,看是否存在着要返回多次的请求.每次往返降低了你的应用程序的每秒能够响应请求的次数.通过在单个数据库请求中返回多个结果集,可以减少与数据库 ...

随机推荐

  1. 老罗最新发布了“子弹短信”这款IM，主打熟人社交能否对标微信？

    1.引言 2018年8月20日,锤子科技在北京召开了夏季新品发布会.除了新手机,发布会上还正式推出了主打语音功能的即时通讯IM聊天工具:子弹短信.这款工具此前今年早些时候在「鸟巢」发布会上初次亮相,在 ...

  2. 基于APNs最新HTTP/2接口实现iOS的高性能消息推送(服务端篇)

    1.前言 本文要分享的消息推送指的是当iOS端APP被关闭或者处于后台时,还能收到消息/信息/指令的能力. 这种在APP处于后台或关闭情况下的消息推送能力,通常在以下场景下非常有用: 1)IM即时通讯 ...

  3. 《设计模式》学习&理解&总结

    教程地址:http://www.runoob.com/design-pattern/design-pattern-tutorial.html 教程书籍:<Android 设计模式解析与实战> ...

  4. 每天学点SpringCloud（十一）：Hystrix仪表盘

    在SpringCloud学习系列博客第六篇文章中,我们已经学习了Hystrix的使用,但是那篇文章中有一点遗漏没有讲,那就是Hystrix Dashboard ,它可以实时的监控Hystrix的运行情 ...

  5. django项目微博第三方登录

    此处咱们用到的是 social_django,所以要把此应用注册到配置文件中, INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.a ...

  6. Java核心技术卷一基础知识-第7章-图形程序设计-读书笔记

    第7章 图形程序设计 本章内容: * Swing概述 * 创建框架 * 框架定位 * 在组件中显示信息 * 处理2D图形 * 使用颜色 * 文本使用特殊字体 * 显示图像 本章主要讲述如何编写定义屏幕 ...

  7. 画线动画——SVG版和纯CSS版

    概述 我们常常在网站中看到一些画线的动画效果,非常炫酷,大多数这种画线动画效果是通过SVG实现的,也有不少是用纯css实现的,下面我总结了一下这2种方法,供以后开发时参考,相信对其他人也有用. 参考资 ...

  8. Python Tkinter 简单使用

    简单的一些实例,能够实现一般的功能就够用了 Tkinter: 创建顶层窗口: # -*- coding: utf-8 -*- from Tkinter import *   root = Tk() r ...

  9. Oracle报错#“ORA-01791: 不是 SELECTed 表达式”解决方法

    今天遇到一个Oracle报错,写篇博客记录一下 简单看一下下面这个sql,这也查询是没报错的 select a.area_seq, a.area_name from t_unit_area a WHE ...

  10. 简介 - SAFe（Scaled Agile Framework，规模化敏捷框架）

    简介 SAFe(Scaled Agile Framework,规模化敏捷框架) SAFe:https://www.scaledagileframework.com/ Scaled Agile Fram ...