随笔分类 -  CSS/CSS3

CSS书写规范
摘要：这个可以慢慢来积累。。。。。。 网易NEC CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(font, line-height, lett 阅读全文
posted @ 2017-03-06 23:54 chenxj 阅读(389) 评论(0) 推荐(0)
居中的实现方法
摘要：在网页设计中，每当涉及到居中时，最重要的就是将元素及其父元素居中。听起来很简单，那你有没有考虑到很多的可能性呢? 水平垂直 已知宽高的元素 如果你同时知道一个元素的宽和高，并且要将元素相对其父元素垂直居中，那么使用绝对定位来实现或许是一种比较不错的办法。 未知宽高的元素 但页面中很多元素都是未知宽高 阅读全文
posted @ 2016-12-27 09:04 chenxj 阅读(287) 评论(0) 推荐(0)
让元素隐藏的方法
摘要：在CSS中，让元素隐藏（指屏幕范围内肉眼不可见）的方法很多，有的占据空间，有的不占据空间；有的可以响应点击，有的不能响应点击。 1、display 这个是彻底的隐藏了元素，不占据空间，也就不影响布局，当然也无法响应事件。 2、visibility 被隐藏的元素依然会对我们的网页布局起作用。但它不会响 阅读全文
posted @ 2016-12-23 08:05 chenxj 阅读(690) 评论(0) 推荐(0)
CSS 继承深度解析
摘要：FROM ME: 之前在研究前端性能优化的时候，就有学习关于CSS中“善用CSS中的继承”。 原文：CSS Inheritance, The Cascade And Global Scope: Your New Old Worst Best Friends 译文：掘金翻译计划 我酷爱模块化设计。长期 阅读全文
posted @ 2016-12-22 22:46 chenxj 阅读(15252) 评论(1) 推荐(0)
流畅web动画的十个法则
摘要：from me: web动画能够带来一个非常酷炫的效果，能够让页面有一个更好的用户体验。对于良好的动画性能没有高招，除了将大量的时间放在测试和优化，当然最重要的还是要易于维护。 流畅web动画的十大法则： · 不要改变除了opacity和transform之外的参数！ · 将内容藏在不起眼的地方 · 阅读全文
posted @ 2016-12-21 23:21 chenxj 阅读(1938) 评论(0) 推荐(0)
CSS技巧-rgba函数的妙用
摘要：先简单介绍一下： rgba()函数是平时开发中经常遇到的，这篇文章也做了一个比较详细的解读以及一系列的应用。 对它的工作原理做一番分析：就是具有一定透明度的盒子； 还比较了rgba()函数和不透明度属性（opacity）的区别：使用 opacity，所有子元素都会受到影响； 在实际开发中，有些地方用 阅读全文
posted @ 2016-12-21 18:54 chenxj 阅读(9242) 评论(0) 推荐(0)
面向对象的 CSS (OOCSS)
摘要：原文链接：来自smashing magazine 译文 你是否听说过一个词语叫“内容就是王道”？作为一个 Web 开发者，我们的工作与内容创作有着频繁的联系。这是一条经常被引用，并且正确地解释了什么因素吸引了人们访问网页的谚语。 然而，从 Web 开发者的角度来看，一些人认为速度就是王道。近年来，许 阅读全文
posted @ 2016-12-18 20:33 chenxj 阅读(5058) 评论(0) 推荐(0)
css3 animation 属性众妙
摘要：转自：凹凸实验室（https://aotu.io/notes/2016/11/28/css3-animation-properties/） 本文不会详细介绍每个 css3 animation 属性（需要了解的同学可先移步 MDN），而是结合实际的开发经验，介绍 css3 animation 属性的一 阅读全文
posted @ 2016-12-18 10:38 chenxj 阅读(3576) 评论(1) 推荐(1)
CSS3中动画属性transform、transition和animation
摘要：Transform：变形 在网页设计中，CSS被习惯性的理解为擅长表现静态样式，动态的元素必须借助于javascript才可以实现，而CSS3的出现改变了这一思维方式。CSS3除了增加革命性的创新功能外，还提供了对动画的支持，可以用来实现旋转、缩放、平移、扭曲和过渡效果等等，这些功能再一次证明了CS 阅读全文
posted @ 2016-12-17 20:41 chenxj 阅读(6767) 评论(0) 推荐(1)
运动曲线提升CSS动画效果
摘要：原文链接 译文\译者鞠大宝 先有UI动画，然后才会有好的UI动画。好的动画会让人惊叹“哇哦！”——因为页面看上去很流畅、很漂亮，最重要的是，自然，一点都不会让人觉得不和谐或者僵硬死板。如果你经常逛Dribbble或者 UpLabs这类网站的话，你就会明白我在说什么了。 一些极好的拓展阅读资源: ·S 阅读全文
posted @ 2016-12-17 09:20 chenxj 阅读(4716) 评论(0) 推荐(0)