css

超赞!值得网页设计师&前端收藏的实用工具列表

无论你是经验丰富的前端,还是刚刚起步的设计师,这些为真正的网页设计师和开发者所准备的实用工具、在线服务、资源和代码片段,都是为你而生的,合理的运用能够让你的网页设计与开发事半功倍。这次总结的工具总计有40款,它们基本上可以分为8个大类·灵感与阅读:这类素材通常是设计案例和酷站,它们启发灵感,给你经验[br]·网络社区:汇集Web开发者和设计师的优秀社区[br]·网页测速工具

horiontal center and vertical middle in CSS

写在前面的话:1: 为了方便起见,接下来我都会把想要居中的元素,不管是一行text,还是一个div,都叫做‘目标元素’, 把包含这个目标元素的叫做‘父元素’。(额。。。。这两个名字如此不对称,我也是醉了。)2: 我会给一个元素设置一个同名的class和id,class用了写一些实际上跟居中没有关系的css,只是为了好看;id呢用来写跟居中有关的css,免得混淆了。Case

css 不规整元素的宽高等比例

不规整元素的宽高等比例在不同屏幕情况中不同宽高的元素都以相同等比例、等宽和等高方式展示。需求设计师希望页面的图片区域,以宽高为2:1比例且所有图片的等宽和等高的方式展示。小加同学觉得设计师这需求太容易,分分钟搞定,拿到图片后便开始刷刷的撸代码。原型设计稿大致如下:初版思路每个图片区域宽度为父元素宽度的25%,图片的宽度设置100%,其高度根据宽度等比例自动缩放(小加以为图片

浏览器渲染的那些事(三)

终于到了布局的部分了!布局当渲染对象被创建并添加到树中,是没有位置和大小的,计算这些值的过程称为layout或reflow。布局是一个递归过程,由根渲染对象开始,对应html文档元素,布局继续递归的通过一些或所有的frame层级,为每个需要几何信息的渲染对象进行计算。跟渲染对象位置是0,0。所有渲染对象都有一个layout或reflow方法,每个渲染对象调用需要布局的chi

切图崽的自我修养(2)-如何规范CSS元素的命名?

前言为什么我刚才写的样式乱了?!如何给变量,文件命名是程序员的老大难问题。命名为什么会这么难,因为它太重要了。可以这么说,准确的命名可以提高代码的可读性,让人容易理解,方便调试,也给以后修改和维护你的代码的人带来方便。如何给元素命名而在css中,如何给元素命名同样是一门艺术。我们先来看看css中对常用的组件的命名:headfootnavmenulist嗯,目前为止很不错,这

Vue.js 开发实践:实现精巧的无限加载与分页功能

本篇文章是一篇Vue.js的教程,目标在于用一种常见的业务场景——分页/无限加载,帮助读者更好的理解Vue.js中的一些设计思想。与许多Todo List类的入门教程相比,更全面的展示使用Vue.js完成一个需求的思考过程;与一些构建大型应用的高阶教程相比,又更专注于一些零碎细节的实现,方便读者快速掌握、致用。需求分析当一个页面中信息量过大时(例如一个新闻列表中有200条新

杂(css)

本用于记录个人学习记录: http://www.zhangxinxu.com/wordpress/2010/01/css-float%E6%B5%AE%E5%8A%A8%E7%9A%84%E6%B7%B1%E5%85%A5%E7%A0%94%E7%A9%B6%E3%80%81%E8%AF%A6%E8%A7%A3%E5%8F%8A%E6%8B%93%E5%B1%95%E4%B

获取元素css值

最近写东西碰到一个问题,通过document.getElementById(id).style.XXX无法获取到样式值?查完资料才发现方法只能获取元素的内联样式,那要获取内部样式或外部样式该怎么办? getComputedStyle 原来获取外部样式或内部样式用的是window.getComputedStyle方法,用法如下:getComputedStylediv{widt