html怎么混合颜色,CSS3 多色混合背景
发布日期:2021-10-23 03:55:48 浏览次数:7 分类:技术文章

本文共 1684 字,大约阅读时间需要 5 分钟。

CSS

语言:

CSSSCSS

确定

@import "https://fonts.googleapis.com/css?family=Lato:300";

html,

body {

width: 100%;

height: 100%;

margin: 0;

padding: 0;

font-family: 'Lato', sans-serif;

}

html {

background: -webkit-linear-gradient(90deg, rgba(0, 0, 200, 0.5), rgba(0, 0, 200, 0));

background: linear-gradient(0deg, rgba(0, 0, 200, 0.5), rgba(0, 0, 200, 0));

}

body {

background: -webkit-linear-gradient(330deg, rgba(50, 150, 100, 0.5), rgba(0, 0, 100, 0));

background: linear-gradient(120deg, rgba(50, 150, 100, 0.5), rgba(0, 0, 100, 0));

}

.container {

background: -webkit-linear-gradient(210deg, rgba(150, 50, 50, 0.5), rgba(0, 0, 200, 0));

background: linear-gradient(240deg, rgba(150, 50, 50, 0.5), rgba(0, 0, 200, 0));

display: -webkit-box;

display: -webkit-flex;

display: -ms-flexbox;

display: flex;

-webkit-box-orient: vertical;

-webkit-box-direction: normal;

-webkit-flex-direction: column;

-ms-flex-direction: column;

flex-direction: column;

-webkit-box-align: center;

-webkit-align-items: center;

-ms-flex-align: center;

align-items: center;

-webkit-box-pack: center;

-webkit-justify-content: center;

-ms-flex-pack: center;

justify-content: center;

margin: 0;

padding: 0;

height: 100%;

width: 100%;

}

h1 {

color: white;

font-weight: 100;

}

.me {

position: fixed;

bottom: 10px;

right: 10px;

}

.me .sg {

width: 35px;

height: 35px;

}

.me .sg .eye {

-webkit-transform: translateX(0px);

transform: translateX(0px);

}

.me .sg:hover .eye {

-webkit-transition: -webkit-transform 0.3s ease;

transition: -webkit-transform 0.3s ease;

transition: transform 0.3s ease;

transition: transform 0.3s ease, -webkit-transform 0.3s ease;

-webkit-transform: translateX(12px);

transform: translateX(12px);

}

转载地址:https://blog.csdn.net/weixin_30496999/article/details/117896300 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:杭州师范大学计算机科学与技术怎么样,杭州师范大学怎么样 王牌专业有哪些...
下一篇:html点击向下滚动,单击滚动条的滚动箭头时

发表评论

最新留言

做的很好,不错不错
[***.243.131.199]2024年04月05日 18时17分58秒

关于作者

    喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!

推荐文章