文档章节

网页布局基础(3)-绝对定位布局

iBazinga
 iBazinga
发布于 2016/12/04 16:55
字数 210
阅读 7
收藏 0
点赞 0
评论 0
CSS

基础知识

position属性具有3种定位形式:



一、相对定位

特点:

        相对于 自身原来的位置 进行偏移;

        仍处于标准文档流中;

        随即拥有偏移属性和z-index属性 // z轴堆叠

二、绝对定位(*)

特点:

        建立包含块为基准的定位;

        完全脱离了标准文档流;

        随即拥有偏移属性和z-index属性

(一)未设置偏移量

        无论是否存在已定位祖先元素,都保持在元素的初始位置

        脱离了标准文档流​​

(二)设置偏移量

        无已定位祖先元素,以<html>为偏移参照基准;

        有已定位祖先元素,以距离其最近的已定位祖先元素为偏移参照基准​​

© 著作权归作者所有

共有 人打赏支持
iBazinga
粉丝 11
博文 127
码字总数 42315
作品 0
深圳
程序员
CSS 基础入门语法

盒模型--边框 盒子模型的边框就是围绕着内容及补白的线,这条线你可以设置它的粗细、样式和颜色(边框三个属性)。 如下面代码为 div 来设置边框粗细为 2px、样式为实心的、颜色为红色的边框:...

御前带刀红衬衫 ⋅ 2016/07/28 ⋅ 0

学习pyqt 基础 3

PyQt4 中的布局管理器 布局管理就是我们在窗口中安排不见位置的方法。布局管理有两种工作方式:绝对定位方式和布局类别方式。一般来说,绝对布局方式用的较少,就像网页,现在不都什么流行响...

Cosven ⋅ 2014/08/17 ⋅ 0

css页面布局

在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素、内联元素(又叫行内元素)和内联块状元素。 常用的块状元素有: <div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<addr......

小神神的大草原 ⋅ 2016/09/05 ⋅ 0

三种三栏网页宽度自适应布局方法

一、前言 在如今各个分辨率显示器N足鼎立的时期,页面采用流动性布局(亦可称自适应布局)不失为一个好选择。当然,具体实现不是那么容易,需要一定的css功力和实践经验。本文不讲细节,只讲...

乱世中的单纯 ⋅ 2016/03/14 ⋅ 0

css的盒子模型

网页布局的本质就是把网页中的元素,例如文字。图片等放在一个盒子里,然后利用css来摆放盒子达成想要的效果,就是网页布局 css的三大模型 1.普通流 2.浮动 元素添加浮动以后,会自动转换成行...

邮币财富-张起荣 ⋅ 03/12 ⋅ 0

后端工程师入门前端页面重构(一):口诀

本文由 KnewHow 发表在 ScalaCool 团队博客。 大家好,我是 KnewHow,一名前 Java 开发工程师。为什么要说是「前」呢?这要从两周前我加入一家新公司说起。 入职第一天,实习导师告诉我会有一...

⋅ 2017/12/19 ⋅ 0

css布局和定位总结

1,布局——盒子模型 (1)盒子模型的组成部分: 盒子模型—网页布局的基石,由4部分组成,边框(border),外边(margin) 内边距(padding),盒子中的内容(content)四个值:上右下左,三...

761218914 ⋅ 2016/07/20 ⋅ 0

三种三栏网页宽度自适应布局方法,转载大神的,适合收藏

一、前言 在如今各个分辨率显示器N足鼎立的时期,页面采用流动性布局(亦可称自适应布局)不失为一个好选择。当然,具体实现不是那么容易,需要一定的css功力和实践经验。本文不讲细节,只讲...

曾杨 ⋅ 2014/03/12 ⋅ 0

关于position和float的初级理解和对未来的一些想法

在现在传统的网页布局里一般都离不开float和position,因为这段时间用纯html和css编写代码,对一些页面布局也有了自己的一些理解,并且也看了一些大神对于float和position的一些观点,所以写...

德拉费尔 ⋅ 2013/06/13 ⋅ 4

WEB前端工程师-练成

一、HTML和CSS基础 1.1 开发工具 1.1.1 前端开发工具技巧介绍-DW篇 1.1.2 前端开发工具技巧介绍-Sublime篇 1.2 HTML和CSS基础课程 1.2.1 HTML+CSS基础课程 1.3 网页布局 1.3.1 如何用CSS进行...

霞女 ⋅ 2015/12/02 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

SpringCloud 微服务 (六) 服务通信 RestTemplate

壹 通信的方式主要有两种,Http 和 RPC SpringCloud使用的是Http方式通信, Dubbo的通信方式是RPC 记录学习SpringCloud的restful方式: RestTemplate (本篇)、Feign 贰 RestTemplate 类似 Http...

___大侠 ⋅ 10分钟前 ⋅ 0

React创建组件的三种方式

1.无状态函数式组建 无状态函数式组件,也就是你无法使用State,也无法使用组件的生命周期方法,这就决定了函数组件都是展示性组件,接收Props,渲染DOM,而不关注其他逻辑。 无状态函数式组...

kimyeongnam ⋅ 17分钟前 ⋅ 0

react 判断实例类型

今天在写组件的时候想通过判断内部子元素不同而在父元素上应用不同的class,于是首先要解决的就是如何判断子元素的类型。 这里附上一个讲的很全面的文章: https://www.cnblogs.com/onepixel...

球球 ⋅ 24分钟前 ⋅ 0

Centos7备份数据到百度网盘

一、关于 有时候我们需要进行数据备份,如果能自动将数据备份到百度网盘,那将会非常方便。百度网盘有较大的存储空间,而且不怕数据丢失,安全可靠。下面简单的总结一下如何使用 bypy 实现百...

zctzl ⋅ 38分钟前 ⋅ 0

开启远程SSH

SSH默认没有开启账号密码登陆,需要再配置表中修改: vim /etc/ssh/sshd_configPermitRootLogin yes #是否可以使用root账户登陆PasswordAuthentication yes #是都开启密码登陆ser...

Kefy ⋅ 41分钟前 ⋅ 0

Zookeeper3.4.11+Hadoop2.7.6+Hbase2.0.0搭建分布式集群

有段时间没更新博客了,趁着最近有点时间,来完成之前关于集群部署方面的知识。今天主要讲一讲Zookeeper+Hadoop+Hbase分布式集群的搭建,在我前几篇的集群搭建的博客中已经分别讲过了Zookeep...

海岸线的曙光 ⋅ 48分钟前 ⋅ 0

js保留两位小数方法总结

本文是小编针对js保留两位小数这个大家经常遇到的经典问题整理了在各种情况下的函数写法以及遇到问题的分析,以下是全部内容: 一、我们首先从经典的“四舍五入”算法讲起 1、四舍五入的情况...

孟飞阳 ⋅ 今天 ⋅ 0

python log

python log 处理方式 log_demo.py: 日志代码。 #! /usr/bin/env python# -*- coding: utf-8 -*-# __author__ = "Q1mi""""logging配置"""import osimport logging.config# 定义三种......

inidcard ⋅ 今天 ⋅ 0

mysql 中的信息数据库以及 shell 查询 sql

Information_schema 是 MySQL 自带的信息数据库,里面的“表”保存着服务器当前的实时信息。它提供了访问数据库元数据的方式。 什么是元数据呢?元数据是关于数据的数据,如数据库名或表名,...

blackfoxya ⋅ 今天 ⋅ 0

maven配置阿里云镜像享受飞的感觉

1.在maven目录下的conf/setting.xml中找到mirrors添加如下内容,对所有使用改maven打包的项目生效。 <mirror> <id>alimaven</id> <name>aliyun maven</name> <url>http://maven.al......

kalnkaya ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部