关闭

移动端布局单位

移动端设备种类繁多,需要适配多种情况的响应式布局来保证美观的页面实现,先来解释容易弄混的多个名词。 PPI 单位英寸像素数DPR 设备像素比: 设备像素 / CSS像素(某一方向上)DPI Dpi(每平方英寸像素数目):图像细节程度的度量 建议看一下知识小科普!像素英寸与DPI的那些事儿 单位:    - em em是相对长度单位。相对于当前对象内文本的font-size(即父元素...
阅读(23) 评论(0)

如何更快地构建与渲染

在上一篇中,我详细描述了浏览器渲染的过程,那么,如何来提升渲染效率,使页面更快的加载完成呢。 我将这些方法分为几部分分别介绍。CSS部分1. 媒体类型和媒体查询  将CSS分割为片段,对于不同的浏览器,不同的终端,不同的阅读模式,应用不同的CSS样式表。如果将这些内容写到统一个文件中,浏览器需要下载并解析他们。所以我们应该将这些内容通过对link元素的media属性来指定: <link...
阅读(210) 评论(0)

[置顶] 完整渲染过程——从URL到页面

当用户输入一串URL(统一资源定位符)到完整的页面渲染出来,到底经历了什么呢~下面我来描述一下整个过程。 先列出他的大致流程: 浏览器根据请求的URL交给DNS域名解析,找到真实的IP,向服务器发起请求; 服务器交给后台处理完后返回数据,浏览器接受文件(HTML/CSS/JS/图像等); 浏览器对加载到的数据进行解析,建立起相应的内部结构; 载入解析到的资源文件,渲染页面,完成。我们主要分为两部分...
阅读(436) 评论(0)

CSS布局--overflow:hidden的清除效果

CSS布局–overflow:hidden的清除效果来自《精通CSS》阅读的思考:原文使用两列的浮动布局,首先设置两列内容为float,并设置display:inline-block,以此防止IE中双外边距浮动产生的bug,然后在两个浮动元素的父元素应用了overflow:hidden原文:因为这些元素是浮动的,它们不再在文档流中占据任何空间,这会导致页脚上升。为了避免这种情况,需要对父元素应用溢出...
阅读(257) 评论(0)

CSS缩写属性整理

CSS缩写属性整理border border-width border-style border-color 顺序任意,除了border-style必须设置外,其余值可以省略为默认值。只能设置全局边框,可以用border-top、border-left等简写属性来覆盖修改局部background以下属性可采用任何顺序,且都是可选属性: background-color background-po...
阅读(255) 评论(0)

CSS ——浮动与定位元素

元素分为正常流和非正常流,非正常流中包含浮动与定位      先说定位,定位包含相对定位(relative)、绝对定位(absolute)以及固定定位(fixed)      position属性:static(默认)| relative | absolute | fixed       无继承性      相对定位:       position:relative       相对...
阅读(193) 评论(0)

CSS——块级、行内元素&盒模型

盒模型是CSS基本模型之一,页面上每个元素都包含在盒模型内,由元素内容、内边距(padding)、边框(border)和外边框(margin)组成       块级元素常见标签:div p form ul ol li h1~h6       行内元素常见标签:span em strong a        块级元素可以包含块级和行内元素,反之则不可。       在排版时,可以用disp...
阅读(232) 评论(0)
    个人资料
    • 访问:11198次
    • 积分:278
    • 等级:
    • 排名:千里之外
    • 原创:30篇
    • 转载:2篇
    • 译文:0篇
    • 评论:8条
    文章分类