CSS中top属性的作用是什么，怎样使用？-群英

上一篇：CSS中vw与vh属性是什么意思，有何区别吗？下一篇：CSS点击边框颜色改变的效果如何实现？

这篇文章我们来了解CSS中top属性的相关内容。在CSS中，top属性是用来设置定位元素距离顶部的距离，是CSS中很基础的知识，因此本文就给大家来介绍一下，对新手学习CSS会有一定的帮助，有需要的朋友可以参考，接下来就跟随小编来一起学习一下吧！

本教程操作环境：windows10系统、CSS3&&HTML5版、Dell G3电脑。

在css中top是什么意思

在css中，top是“顶部”的意思，top属性用于设置定位元素距离顶部的距离。

top 属性规定元素的顶部边缘。该属性定义了一个定位元素的上外边距边界与其包含块上边界之间的偏移。

注释：如果 "position" 属性的值为 "static"，那么设置 "top" 属性不会产生任何效果。

语法如下：

position：absolute； //这个是必须的，top和left才能起作用
top: 10px; //距离顶部10像素，就是想下面移动10像素

示例如下：

<html>
<head>
<style type="text/css">
img{
position:absolute;
top:30px;
}
</style>
</head>
<body>
<img src="1115.08.png" />
<h1>This is a heading</h1>
</body>
</html>

输出结果：

现在大家对于CSS中top属性的作用和使用应该都清楚了吧，上述示例有一定的参考价值，需要的朋友可以了解看看，希望大家阅读完这篇文章能有所收获。最后，想要了解更多大家可以关注群英网络其它相关文章。

文本转载自PHP中文网

标签： css top属性

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

上一篇：CSS中vw与vh属性是什么意思，有何区别吗？下一篇：CSS点击边框颜色改变的效果如何实现？