码迷,mamicode.com
首页 > 其他好文 > 详细

定位及部分属性

时间:2018-08-15 15:32:45      阅读:137      评论:0      收藏:0      [点我收藏+]

标签:translate   otto   ali   特性   lin   latex   back   决定   出现   

一、Position定位:

  1. Relative:相对定位,定位之后原始位置保留,新位置不占位,相对于自己定位。
  2. Absolute:绝对定位,相对最近的父级定位定位,不占位置。
  3. Fixed:固定定位,相对于视窗(body)定位。

注意:定位后会使用:top、left、right、bottom。且定位后四个方向决定位置(两个就足够,水平和垂直各选一个。)定位建议必要时再使用以免出现不必要的麻烦。

定位或者浮动之后都会脱离普通流,这时就要涉及到层级,设置z-index属性即可。

二、C3特性居中不知宽高的嵌套盒子:

  使用定位,先使图片移动宽、高各移动50%,定位后使用transform属性,值为translate(各移动嵌套内盒子的-50%),即可居中。

三、C3transform:

  (1) Rotate:翻转。

  (2) Translate:平移。(translatex/translatey)

  (3) Scale:放大。

  (4) Skew() 方法,元素翻转给定的角度,根据给定的水平线(X 轴)和垂直线(Y 轴)参数:

四、部分属性:

  1. background-position: 0 -28px;(背景图定位)
  2. text-align: center;(文本居中,也适用于父级元素设置本属性居中行内块子元素)
  3. Outline (轮廓);
  4. Outline-color
  5. Outline-style
  6. Border:none;(取消边框所有设置)

定位及部分属性

标签:translate   otto   ali   特性   lin   latex   back   决定   出现   

原文地址:https://www.cnblogs.com/shangXR/p/9481575.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!