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

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;
width: 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;
width: 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>

行内元素进行绝对(absolute),固定(fixed)定位后会变成块级元素·的更多相关文章

  1. 04. H5标签有哪些?行内元素有哪些?块级元素有哪些?空(void)元素有哪些?行内元素和块级元素有什么区别?你工作中常用标签有什么?

    4. H5标签有哪些? 2)行内元素有哪些? a - 锚点 em - 强调 img - 图片 font - 字体设定 ( 不推荐 ) i - 斜体 input - 输入框 3)块级元素有哪些? add ...

  2. [转]CSS块级元素和行内元素

    原地址:http://www.studyofnet.com/news/398.html 本文导读:HTML中的元素可分为两种类型:块级元素和行级元素.这些元素的类型是通过文档类型定义(DTD)来指明. ...

  3. html行内元素、块级元素及空元素有哪些?区别是什么?

    一. html标签有哪些? 1)行内元素有哪些? 行内元素:行内大多为描述性标记 <span>...</span> <a>...</a>  链接. 锚点 ...

  4. html元素类型 块级元素、内联元素(又叫行内元素)和内联块级元素。

    html中的标签元素大体被分为三种不同的类型:块级元素.内联元素(又叫行内元素)和内联块级元素. 块级元素特点: 1.每个块级元素都从新的一行开始,并且其后的元素也另起一行.(霸道,一个块级元素独占一 ...

  5. {03--CSS布局设置} 盒模型 二 padding bode margin 标准文档流 块级元素和行内元素 浮动 margin的用法 文本属性和字体属性 超链接导航栏 background 定位 z-index

    03--CSS布局设置 本节目录 一 盒模型 二 padding(内边距) 三 boder(边框) 四 简单认识一下margin(外边距) 五 标准文档流 六 块级元素和行内元素 七 浮动 八 mar ...

  6. css菜鸟学习之text-align属性,行内元素,块级元素居中详解

    一.text-align属性 1.text-align用来设置元素中的的文本对齐方式,例如:如果需要设置图片的对齐方式,需要设置图片的父元素的text-align属性: 2.text-align只对文 ...

  7. 《Web开发中块级元素与行内元素的区分》

    一.块级元素的特性: 占据一整行,总是重起一行并且后面的元素也必须另起一行显示. HTML中块级元素列举如下: address(联系方式信息) article(文章内容) aside(伴随内容) au ...

  8. CSS设置行内元素和块级元素的水平居中、垂直居中

    CSS设置行内元素的水平居中 div{text-align:center} /*DIV内的行内元素均会水平居中*/ CSS设置行内元素的垂直居中 div{height:30px; line-heigh ...

  9. CSS基础知识(概念、块级元素、行内元素、选择器)

    1.CSS概念 全称为Cascading Style Sheets(层叠样式表),支持专有的文件 - 扩展名为".css" 作用:将HTML的结构(HTML标签即html)与样式( ...

随机推荐

  1. 【ZOJ】4012 Your Bridge is under Attack

    [ZOJ]4012 Your Bridge is under Attack 平面上随机n个点,然后给出m条直线,问直线上有几个点 \(n,m \leq 10^{5}\) 由于共线的点不会太多,于是我们 ...

  2. Navicat通过跳板机连接MySQL(2层跳转)

      情景描述,公司开发数据库部署在内网,而且这个开发数据库有连接需要有IP验证,就是只能在内网的某个IP才能连接,所以每次连接都会先连接外网能访问的跳板机,在从跳板机上ssh到内网上的A机器,在从A机 ...

  3. BP(back propagation)误差逆传播神经网络

    [学习笔记] BP神经网络是一种按误差反向传播的神经网络,它的基本思想还是梯度下降法,中间隐含层的误差和最后一层的误差存在一定的数学关系,(可以计算出来),就像误差被反向传回来了,所以顾名思义BP.想 ...

  4. 有关Linux服务器的一些配置

    1.Redis部署 1.版本 redis-3.0.72.上传解压 3.编译 make && make install 问题:/bin/sh: cc: command not found ...

  5. bs4解析

    介绍:将一个html文档转换成BeautifulSoup对象,然后通过对象的方法或属性查找指定的节点内容 转换本地文件: ​ soup = BeautifulSoup(fp,'lxml') fp为文档 ...

  6. Fabric中的节点类型

    在Fabric中,尽管所有对等节点/peer都是相同的,但它们可以根据网络的配置方式承担多个角色:(①②是主要的节点类型) ①提交节点: 通道中的每个对等节点都是一个提交节点.它们接收生成的交易区块, ...

  7. MySQL 使用tee记录语句和输出日志

    在mysql命令行中,使用tee命令,可以记录语句和输出到指定文件.在debugging时会很有用.每执行一条语句,mysql都会讲执行结果刷新到指定文件.Tee功能只在交互模式生效. mysql&g ...

  8. pycharm使用pylint

    # 与能查到的多数博文做法不太一样,自认为这样更简单有效 1. 下载插件 https://plugins.jetbrains.com/plugin/11084-pylint 2. 从磁盘安装插件 注意 ...

  9. c#入门学习笔记

    Hello World //打印语句 Console.WriteLine("Hello World"); //暂停 Console.ReadKey(); 数据类型 1.值类型 by ...

  10. stm32 rtc 实时时钟

    STM32的实时时钟是一个独立的定时器 通常会在后备区域供电端加一个纽扣电池,当主电源没有电的时,RTC不会停止工作 若VDD电源有效,RTC可以触发秒中断.溢出中断和闹钟中断 备份寄存器BKP 备份 ...