流动模型

Posted Rinpe

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了流动模型相关的知识,希望对你有一定的参考价值。

第二点,在流动模型下,内联元素都会在所处的包含元素内从左到右水平分布显示。(内联元素可不像块状元素这么霸道独占一行)

右侧代码编辑器中内联元素标签a、span、em、strong都是内联元素。

示例:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>流动模式下的内联元素</title>
<style type="text/css">

</style>
</head>
<body>
    <a href="http://www.rinpe.com">www.rinpe.com</a><span>我是伪强调</span><em>我是重点</em>
    <strong>我还是强调</strong>
</body>
</html>

效果:

以上是关于流动模型的主要内容,如果未能解决你的问题,请参考以下文章

CSS--浮动与定位

流动模型

18 12 27 css 盒模型使用 以及相关技巧问题 元素溢出 块元素内联元素内联块元素

内联元素的盒子模型与文档流定位padding属性

CSS布局模型

前端基础面试题之语义化+块级元素和内联元素+css布局盒模型