如何掌握Joomla! 1.5的网站建设基础教程以跟上技术发展的步伐？

joomla! 1.5 网站建设基础教程,网站建设技术发展现状,企业网站的建站步骤,wordpress centos 7传统的黏性定位是使用js通过计算高度来实现的#xff0c;当元素滚动到一定位置时吸附在当前位置。下面我们通过css来实现黏性定位功能。 黏性定位 黏性定位目前主流的浏览器已经全部支持#xff0c;顾名思义#xff0c;黏性定位具有吸附的效果#xff0c;其实它是positio…传统的黏性定位是使用js通过计算高度来实现的当元素滚动到一定位置时吸附在当前位置。下面我们通过css来实现黏性定位功能。 黏性定位 黏性定位目前主流的浏览器已经全部支持顾名思义黏性定位具有吸附的效果其实它是position的新增属性语法position: sticky;开启了黏性定位后元素会根据top值来吸附到父元素的指定位置。 黏性定位的需要了解的地方 1、黏性定位的元素发生偏移是元素的原始位置是保留的。 2、如果黏性定位内部有绝对定位的子元素那么该子元素的绝对定位是指向发生偏移的位置而不是原位置。 3、黏性定位可以通过z-index改变层叠顺序。 下面是黏性定位的一个实现 div styleoverflow: scroll;height: 500px;margin: 100px;border:1px solid red;div classtopSticky抽奖活动/divdiv classemptyChunk v-for(item,index) in 6内容{{ index }}/div /div .topSticky{width: 240px;height: 30px;text-align: center;line-height: 30px;margin-top: 30px;border: 1px solid red;background-color: #80c342;position: sticky; /*黏性定位*/top: 0; /*具体父级元素吸附的距离*/} .emptyChunk{height: 200px;width: 240px;border: 1px solid green; }如果父级元素不存在那么会默认指向web窗口黏性定位偏移是相对于父级元素计算的效果只有在父级元素内滚动时才会体现而且黏性定位的父级元素不一定是直属父级距离黏性定位最近的那个滚动元素就是黏性定位的目标只要黏性定位元素的父级div1:overflow: scroll;-div2-div3-div4:sticky)发生滚动那么当前黏性定位会指向发生滚动的最近一级的父级元素div4 - div1。 顶层黏性定位黏性定位的默认定位为父级如果父级元素不存在那么会默认指向web窗口 黏性约束矩形 如果黏性定位的元素高度父元素高度那么黏性定位的效果会失效。 上面案例中蓝色矩形是橙色矩形的父级蓝色的矩形就构成了黏性定位矩形橙色黏性定位的指向为开启了滚动了红色边框盒子红色盒子内部滚动的时候橙色矩形滚动到距离红色盒子顶部20px的时候吸附继续滚动蓝色矩形的高度会慢慢变小当橙色矩形的高度 蓝色矩形高度时黏性定位会失效继续滚动时橙色矩形会随着滚动而消失。