前端之webPageMaking
文章平均质量分 68
BJ_benjamin
因为记性不好所以只好多做总结因为不进则退所以需要多停下来思考方向
展开
-
A4纸基本介绍
简 介 A4纸是ISO 216(纸张国际化标准尺寸),是世别界上大多数国家所使用的A4纸尺寸。目前中国采用的是ISO 216标准,以规范纸大小,与国际通用。A4纸尺寸 A4纸(210×297) A3纸(297×420) A2纸(420×594) A1纸(594×841) A0纸(841×1189) 备注:长(mm)×宽(mm) 单位:毫米(mm)A4转载 2013-04-04 13:15:47 · 2426 阅读 · 0 评论 -
为 Web 设计师准备的 25+ 款扁平 UI 工具包
Flat UI Kit by Riki Tanone (free) Flat UI Kit (PSD) by Devin Schulz (free) Eerste UI Kit (free) Metro UI kit (free) Ui Kit by Abhimanyu Rana (free) Flat Ui Kit转载 2013-11-20 09:45:33 · 3845 阅读 · 0 评论 -
文字“中间划线”的几种CSS实现
写在前面的话,今天中秋假期最后一天,明天又得开始苦逼的生活了,在地铁上看到一篇文本“中间划线”的微博,有点时间测试下,增长点小知识。1)首先来看看text-decoration这个属性可能的属性值:浏览器支持如下图:所有主流浏览器都支持 text-decoration 属性。注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "i原创 2013-09-21 18:24:30 · 22410 阅读 · 0 评论 -
最近在用表格呈现数据时遇到的问题
下面基本都是干货,留下此文以备以后遇到问题可以加深印象。1)发现多表格,使用样式控制宽度,相同列不能对齐的问题? 解决方案: a>多表格改为单表格 ... ... ... b>使用javascript控制,一次性初始化各列宽度(但有时还会有问题)2)表格的table-layout样式?定义:table-layout:属性用来显示表格单元格、原创 2013-09-11 20:02:16 · 1186 阅读 · 0 评论 -
网站升级到IE10可能遇到的问题和部分解决方案
第1章 网站迁移简介1.1 网站开发过去和现在 在过去专门针对IE6开发的系统中可能存在一些现在主流高版本浏览器不兼容的代码或样式,过去和现在Web开发的现状如下图。 IE版本从6升级到10过程中,由于IE10执行较新的Web标准,在IE9之前正确执行的代码或渲染的样式,在IE10中可能会失效,具体会在后面总结到。1.2 解决兼容性方法1.2.1 修复可以通过设置网原创 2013-09-04 17:23:00 · 2700 阅读 · 0 评论 -
网站字体渲染过程
本文来自腾讯ISUX团队成员“麦时”分享 (http://isux.tencent.com/website-font-rendering-process.html)前言我们知道同一种字体在不同浏览器上的表现有可能是不同的,除了浏览器,还有哪些导致表现不同的因素呢?不同系统下字形的渲染也是不一样的,根本原因是什么呢?我们希望各浏览器下字体排版一致,实现的话有完美的方案吗?带着这些问题转载 2013-09-02 13:55:26 · 1619 阅读 · 0 评论 -
IE6/7下移除button、input 默认边框和去掉焦点线
一、去掉边框:看看基本的HTML: 通常解决这样的bug最好的方法就是在button和input的标签外添加一个标签,然后将样式写在这个标签上,并且把button和input的默认样式都去除掉。实现方式一:设置CSS: input{margin:0;padding:0;} .wrap{background-color:#0f0;} .input_原创 2013-08-15 00:13:54 · 5955 阅读 · 0 评论 -
淘宝栅栏布局模块化命名浅析
先来看下淘宝网的一处3栏布局:点击放大这里是对应的代码:我们可以看到 class=”grid-c3-s5e7″ 这个命名似乎有些特别,再看看其包含的class=”col-main” 和 class=”col-sub” 以及 class=”col-extra skin-orange”再多一些样本代码:.grid-c, .grid-c2-s4, .grid-c2转载 2013-08-26 10:15:32 · 1486 阅读 · 0 评论 -
HTML4.0元素默认样式
html, address,blockquote,body, dd, div,dl, dt, fieldset, form,frame, frameset,h1, h2, h3, h4,h5, h6, noframes,ol, p, ul, center,dir, hr, menu, pre { display: block; unicode-bidi: embed }li原创 2013-08-12 19:47:10 · 931 阅读 · 0 评论 -
Filter介绍及常用滤镜总结
常用滤镜总结:基本语法:style="filter:filterName(filterParam01, filterParam02,...)"{filterName:滤镜名称filterParam01,filterParam02:滤镜参数} 滤镜说明:Alpha:设置透明层次 blur:创建高速度移动效果,即模糊效果Chroma:制作专用颜色透明DropShadow:创建对原创 2013-07-25 13:03:25 · 1395 阅读 · 0 评论 -
浏览器渲染页面、CSS原理及优化
在写css代码时 做一些简单的优化,这样css的渲染速率会有一定的提高的。浏览器是如何渲染页面和加载页面为什么有些网站打开的时候会加载会很慢,而且是整个页面同时显示的,而有些网站是从顶到下逐步显示出来的?要搞懂这个可以先从下面这个常规流程开始:浏览器下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时进行的。在渲染到页面的某一部分时,其上面的所有部分都已经下载转载 2013-07-26 09:54:36 · 4549 阅读 · 0 评论 -
CSS之vertical-align属性测试
关于vertical-align:的几个属性的情况一直处于模棱两可的状态,今天特来研究下,这个几个属性,并对几个属性在不同浏览器中的表现进行测试vertical-align的常用属性有baseline,top,bottom,text-top,text-bottom,middle下面看看测试用例:第一种情况,默认行高的情况下:1)demo01:vertical-align:bas原创 2013-06-09 13:18:52 · 1451 阅读 · 0 评论 -
兼容所有浏览器的页面黑白代码
html{filter: grayscale(100%);-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: url("data:image/svg+xml;utf8,#grays原创 2013-04-26 23:06:32 · 4121 阅读 · 0 评论 -
input文本框在实践中遇到的对齐问题
直接上代码: .wrap{ font-size:12px;font-family:Arial,'simsun'; background:#ccc; margin-bottom:5px; line-height:30px;} input { margin:0 5px 0 0 ; padding:0; vertical-align:middle } .txt{ padding:6p原创 2013-04-07 13:36:18 · 3614 阅读 · 0 评论 -
初识Flexbox 布局
一、首先创建一个flexbox容器 .flexboxcontainer{ display: -webkit-flex; display: flex; }二、flex项按行排列flex项目默认按行排列,也可设置为column,按列排列,默认设置为row .flexboxcontainer{ display: -webkit-flex; display:原创 2013-11-27 00:29:48 · 1750 阅读 · 0 评论