css+js实现文字标签横向无限滚动循环效果代码
代码语言:html
所属分类:加载滚动
代码描述:css+js实现文字标签横向无限滚动循环效果代码
代码标签: css js 文字 标签 横向 无限 滚动 循环
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> :root { --dark: #252A2E; --light: #F5F5F5; --background: var(--light); --text: var(--dark); --border: var(--dark); } @media (prefers-color-scheme: dark) { :root { --background: var(--dark); --text: var(--light); --border: var(--light); } } html { box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } /* BASIC STYLING FOR THE DEMO */ body { display: grid; min-block-size: 100vh; place-content: center; background: var(--background); color: var(--text); } /* CURRENT MAX WIDTH IS JUST FOR DEMO PURPOSES */ .tag-scrollers { width: 100%; max-width: 1200px; overflow: hidden; } /* POSSIBLY UPDATE COLORS IN THE GRADIENT TO MATCH THE PROJECTS DESIGN SYSTEM */ .tag-scroller { display: grid; .........完整代码请登录后点击上方下载按钮下载查看
网友评论0