文档章节

NOTE:CSS

猪刚烈
 猪刚烈
发布于 2014/10/12 11:40
字数 482
阅读 8
收藏 0

2009-9-12

 

1.关于网页的几种常见布局:

 

 

固定宽度布局:Fixed Width,这种很常见,像新浪博客就是这种类型的。对于这种布局,在网页宽度上有这么个标准:

 

 

Many fixed-width designs are about 760 pixels widea good size for 800 x 600 screens (since you need to leave a little room for scrollbars and other parts of the browsers "chrome"). However, more and more sites (especially ones aimed at a more tech-savvy crowd) are about 950 pixels wide, on the assumption that visitors have at least 1024 x 768 monitors.

也就是:对于800*600的显示器,760个像素是比较不错的,对于1024*768的显示器,950个像素比较合适。

 

2.关于margin属性的参数问题:

3.关于absolute和relative:

relative在做位置偏移时,参考的原点坐标是自己的正常位置!注意:这个位置要受margin,padding这些元素的影响。

absolute做位移时一定要参考它的上级父容器,直至找到离他最近的带有position属性的父容器,然后以此父容器的原点为坐标原点进行位移。

如果没有找到,那参照的父容器就是<html>.

从实质上来讲,position的作用就是要把一个元素移到一个指定的位置!移动的关键是要找好参照的坐标原点。本质上讲,relative和absolute就是两种确定参照原点的方法。relative不管它的父窗口有没有被position过,它只是很“单纯”从它本来应该处的位置上进行移动。而absolute则是另外一套定位方法:它要找到一个被position过的父容器,以那个父容器为基准进行位移。这暗示:使用absolute的容器是要和被position过的父容器搭配使用的。从而联合构建一种忽略各元素间原本的位置关系而直接参照父容器进行布局的方法!

本文转载自:http://blog.csdn.net/bluishglc/article/details/4545158

共有 人打赏支持
猪刚烈
粉丝 22
博文 708
码字总数 110
作品 1
海淀
程序员
sass笔记-1|Sass是如何帮你又快又好地搞定CSS的

Sass学习笔记持续整理中,开篇不讲怎么安装,sass是什么,这些搜索引擎会告诉你,我们从sass的作用开始讲起,知道sass用来干什么,有什么作用,我们才能相信用sass的好处,并且时时刻刻想着s...

Stinson_Zhao
2016/11/29
377
0
AngularJS笔记3-- ng-show ng-class

ng-show / ng-hide 通过绑定一个布尔型的变量,显示或隐藏HTML元素。 当 note.assignee为 true ( 也可以是非空字符串·,非0数字,非空JS对象等)时,assignee所对应的span元素可见。 ng-cla...

奋斗的小芋头
2016/11/22
3
0
appendDom

This plugin allows for easier and more intuitive creation of dom elements. Examples Static List Dynamic List Dynamic Tables Loading Remote Javascript/CSS Assigning Event Handler......

匿名
2008/09/19
539
0
jDrawer

This plugin is creates a stylish drawer (slider) out of a list. jDrawer automatically calculates the height of the , the first and last children, the drawer dimensions, and much......

匿名
2008/09/19
661
0
CRS-4402(Doc ID 1212703.1)

In this Document Symptoms Changes Cause Solution Scalability RAC Community References APPLIES TO: Oracle Database - Enterprise Edition - Version 11.2.0.2 to 12.1.0.1 [Release 11......

Vimeo
2016/02/24
199
0

没有更多内容

加载失败,请刷新页面

加载更多

分布式缓存架构设计

零、 题记 在高并发场景下,需要通过缓存来减少数据库的压力,使得大量的访问进来能够命中缓存,只有少量的需要到数据库层。由于缓存基于内存,可支持的并发量远远大于基于硬盘的数据库。所以...

Ala6
30分钟前
2
0
简单工厂模式

public abstract class Operation { private double numberA = 0; private double numberB = 0; public double getNumberA() { return numberA; } ......

NinjaFrog
32分钟前
1
0
git(一) 基本操作(branch、tag、冲突)

layout: blog istop: true title: "git基本操作(branch、tag、冲突)" date: 2018-09-11 category: 版本控制 tags: - 版本控制 撤销操作 修改最后一次提交 解释:修改上次提交。可以修改内容...

开心的哈士奇
35分钟前
1
0
Vue中路由管理器Vue Router使用方式(二)-推荐

一、Vue中使用Vue Router简单方式使用 vue add xxx命令添加插件 使用步骤,本人假设已经安装好了Vue CLI工具,了解更多参考:VSCode 搭建Vue开发环境之Vue CLI 1.创建项目 vue create hello...

tianma3798
48分钟前
1
0
设计模式(十六)[结构模式] 装饰模式(Decorator)

1.什么是装饰模式? 装饰模式又名包装模式。装饰模式以对客户端透明的方式扩展对象功能,是继承关系的一个替代方案。 2.模式的类图 抽象构件(Component)角色:给出一个抽象接口,以规范准备接收...

1527
49分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部