其他分享
首页 > 其他分享> > rotatin-nav-animation

rotatin-nav-animation

作者:互联网

1.可以用 <i> 标签把 Font Awesome 图标放在任意位置。

<button id="close">
    <i class="fas fa-times"></i>
</button>
<button id="'open">
    <i class="fas fa-bars"></i>
 </button>

2.

 transform-origin: top left;

transform-origin属性 - Cloud% - 博客园 (cnblogs.com)

3..container.show-nav  ???

.container.show-nav {
    transform: rotate(-20deg);
}
.container.show-nav .circle {
    transform: rotate(-70deg);
}

4.在顶部设置1/4圆

.circle-container {
    position:fixed;
    top: -100px;
    left: -100px;
}
.circle {
    background-color: #ff7979;
    height: 200px;
    width: 200px;
    border-radius: 50%;
    position: relative;
    transition: transform 0.5s linear;
}

 

 5.background:transparent

css 中的background:transparent到底是什么意思有什么作用_CSS教程_CSS_网页制作_脚本之家 (jb51.net)

6.CSS 中 >、~、+ 、空格、逗号的用法 - 知乎 (zhihu.com)

7.css list-style-type属性笔记 (baidu.com)

8.可以将输入到文本框中的小写字母转换成大写字母

nav ul li {
    text-transform: uppercase;
}

9.text-decoration:none或underline (添加和消除下划线)

nav a{
    color-scheme: #fafafa;
    text-decoration: none;
}

 

标签:container,show,text,transform,rotatin,animation,nav,background
来源: https://www.cnblogs.com/anpu/p/16369364.html