1. 首页
  2. 数据库
  3. 其它
  4. CSS中的translate( 50% 50%)实现水平垂直居中效果

CSS中的translate( 50% 50%)实现水平垂直居中效果

上传者: 2021-02-01 20:44:05上传 PDF文件 35.95KB 热度 13次
translate(-50%,-50%) 属性: 向上和左,移动自身长宽的 50%,使其居于中心位置。 与使用margin实现居中不同的是,margin必须知道自身的宽高,而translate可以在不知道宽高的情况下进行居中,tranlate函数中的百分比是相对于自身宽高的百分比 (使用top和left为50%时,以窗口左上角为原点)。 示例: <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <meta name=viewport content=width=
下载地址
用户评论