zoukankan      html  css  js  c++  java
  • 行内元素进行绝对(absolute),固定(fixed)定位后会变成块级元素·

    行内元素进行绝对定位后会变成块级元素·

    position:absolute;

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
    /* *{
    padding: 0;
    margin: 0;
    } */
    span{
    position: absolute;

    /* 一定要写四个位置,否则无法居中显示 */
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    400px;
    height: 400px;
    background: rgba(255, 0, 255, .6);
    margin: auto;
    }
    </style>
    </head>
    <body>
    <span>行内元素进行绝对定位后会变成块级元素</span>
    <a href="#">行内元素进行绝对定位后会变成块级元素</a>
    <a href="#">样式,先写width,height,position,top,right,bottom,left确定位置</a>
    <a href="#">再写不影响布局的color,background,font-size,font-family等等</a>
    </body>
    </html>

    ==============================================

    行内元素进行固定定位后会变成块级元素·

    position:fixed;

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
    /* *{
    padding: 0;
    margin: 0;
    } */
    span{
    position: fixed;

    /* 一定要写四个位置,否则无法居中显示 */
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    400px;
    height: 400px;
    background: rgba(255, 0, 255, .6);
    margin: auto;
    }
    </style>
    </head>
    <body>
    <span>行内元素进行绝对定位后会变成块级元素</span>
    <a href="#">行内元素进行绝对定位后会变成块级元素</a>
    <a href="#">样式,先写width,height,position,top,right,bottom,left确定位置</a>
    <a href="#">再写不影响布局的color,background,font-size,font-family等等</a>
    </body>
    </html>

  • 相关阅读:
    JAVA 读取Properties文件内容乱码 解决方法
    java代码求IP和mac地址
    jsp 清除session的方法
    Go语言字符串和正则表达式
    go语言:字符串操作
    博客园美化基本完成!!!
    美化了一下页面
    第一天:初入博客园
    c语言实参与形参的区别
    c链表中指针的一些用法要点
  • 原文地址:https://www.cnblogs.com/Knowledge-is-infinite/p/11112085.html
Copyright © 2011-2022 走看看