固定页脚,不滚动。
自定义头部
<style>
/* 固定页脚,设置页脚颜色背景 */
#mefooter {
height: 6%;
width: 100%;
position: fixed;
bottom: 0px;
left: 0px;
background-color: #f5f8fa;
}
</style>
自定义body
<div id="mefooter" style="font:14px Apple LiGothic Medium; margin:0px auto; text-align:center;">
<br>
<font color="#757575">Copyright © 2022 <a class="Bth" href="https://www.mediy.cn" one-link-mark="yes" target="_blank">Mediy.cn 版权所有</a>
<a class="Bth" href="https://beian.miit.gov.cn" target="_blank"><font color="#757575">蜀ICP备2020028076号</a>
<a class="Bth" href="https://pan.mediy.cn/@manage" target="_blank"><font color="#757575">管理</a>
<br>
</div>
效果图
背景混合色渐变,下面两段代码要配合使用
自定义头部
.chakra-ui-light{
background-image: linear-gradient(310deg, #7ec4e9 10%, #fff, #eee);
background-attachment: fixed;
}
.chakra-ui-dark {
background-image: linear-gradient(310deg, #795548 17%, #055160, #b90f49);
background-attachment: fixed;
}
背景混合色body
<!--و”¾هœ¨è‡ھه®ڑن¹‰body-->
<!-- و¸گهڈک背و™¯هˆه§‹هŒ– -->
<canvas id="canvas-basic"></canvas>
<script src="https://hk-oss.9t.ee/JavaScript/Alist-granim.min.js"></script>
<script>
var granimInstance = new Granim({
element: '#canvas-basic',
direction: 'left-right',
isPausedWhenNotInView: true,
states : {
"default-state": {
gradients: [
['#a18cd1', '#fbc2eb'],
['#fff1eb', '#ace0f9'],
['#d4fc79', '#96e6a1'],
['#a1c4fd', '#c2e9fb'],
['#a8edea', '#fed6e3'],
['#9890e3', '#b1f4cf'],
['#a1c4fd', '#c2e9fb'],
['#fff1eb', '#ace0f9']
]
}
}
});
</script>