#1、定义CSS样式

.box {
width: 100%;
margin: 0 auto;
/* border: 0.2px solid gray; */
overflow: hidden;
} .animate {
padding-left: 20px;
font-size: 12px;
color: #000;
display: inline-block;
white-space: nowrap;
animation: 240s wordsLoop linear infinite normal;
} @keyframes wordsLoop {
0% {
transform: translateX(200px);
-webkit-transform: translateX(200px);
}
100% {
transform: translateX(-100%);
-webkit-transform: translateX(-100%);
}
} @-webkit-keyframes wordsLoop {
0% {
transform: translateX(200px);
-webkit-transform: translateX(200px);
}
100% {
transform: translateX(-100%);
-webkit-transform: translateX(-100%);
}
}

#2、编写首页HTML代码

<div class="box">
<p class="animate">
//这里填写滚动的内容
</p>
</div>

Blogs添加横幅滚动条的更多相关文章

  1. 为TListBox添加水平滚动条

    为TListBox添加水平滚动条 实例说明 TListBox组件是一个较为常用的列表组件,在默认情况下该组件是没有水平滚动条的,所以文字过长会显示不完全,在文字较短的情况下还可以,但是如果一行的文字很 ...

  2. VB ListBox 添加横向滚动条

    Private Declare Function SendMessage Lib "user32 " Alias "SendMessageA" (ByVal h ...

  3. 移动端添加横向滚动条&隐藏

    添加横向滚动条ul { display: flex; overflow-x: auto; overflow-y: hidden; white-space: nowrap; }隐藏滚动条,保留滚动效果 ...

  4. 为MFC中的ListBox添加水平滚动条

    我们知道,MFC中的水平滚动条并不像垂直滚动条那样的智能.当文字超出ListBox的宽度时,水平滚动条并不会自己出现,我们需要手动的调用CListBox中的函数SetHorizontalExtent设 ...

  5. html table表格列数太多添加横向滚动条

    HTML的table表格的列数如果太多或者某一列的内容太长,就会导致表格td的内容被挤压变形,对后台的使用体验非常不友好.比如下面的情况: 那么如何在表格列数较多的情况下添加横向滚动条?其实很简单,只 ...

  6. 解决easyui-tab添加tab滚动条问题

    //添加tab var addTab = function (title, url, icon) { if (!$('#mainTab').tabs('exists', title)) { $('#m ...

  7. 在word2010中添加带滚动条的文本框

    由于文件内容过长,为了加强文章的可读性,可以添加一个带滚动条的文本框,既能使文章看起来干净整洁,同时也极大的提高了文章的可读性. 我这里对在word2010中文本框带滚动条作个介绍: 1. 打开wor ...

  8. MFC中关于CListBox控件添加水平滚动条

    首先是设置listbox控件的属性  Horizontal Scroll设为TRUE: 然后添加函数到CUighurRecognitionDlg.cpp(在CUighurRecognitionDlg. ...

  9. EasyUI combobox下拉框添加水平滚动条和垂直滚动条

    在EasyUI中combobox组件设置滚动条: 1.垂直滚动条:设置panelHeight属性,默认200,组件的数据过多滚动条自动出现,设置auto,则不出现滚动条. 2.水平滚动条:水平滚动条在 ...

随机推荐

  1. HDU4632 Palindrome subsequence

    标签(空格分隔): 区间qp Palindrome subsequence \[求一个string的 回文子序列 的个数 \] 少废话,上代码. #include<bits/stdc++.h&g ...

  2. 通过python基于netconf协议获取网络中网元的配置数据,助力企业网络控制自动化轻松实现!

    摘要:在当今信息化时代,大多数企业都需要网络支撑企业的ICT运行,提升企业运行效率,针对企业网络中的网元设备(包括交换机,路由器,防火墙等),很多企业希望根据自身的业务特点定制网络管理,比如可以实现网 ...

  3. javaAgent打包找不到premain类文件解决

    agent 作用和开发 可以用独立于应用程序之外的代理(agent)程序来监测和协助运行在JVM上的应用程序.这种监测和协助包括但不限于获取JVM运行时状态,替换和修改类定义等. 由此可知agent ...

  4. C语言新手入门

    include<stdio.h> int main() { //输入一个数 输出它的反序列 c int a,b=0; scanf("%d",&a);//输入一个 ...

  5. C语言讲义——运算符(operator)

    运算符(operator) 算数运算符 7种 关系运算符 6种 逻辑运算符 3种 位运算符 6种 赋值运算符 11种 共5类33种 算术运算符 加 + 减 - 乘 * 除 / 取余 % (仅限于整数类 ...

  6. 03_Service的绑定

    Start Service启动的Service,Application退出,Service也不会退出: Bind Service启动的Service,Application退出,Service就会退出 ...

  7. Nginx配置Https(详细、完整)

    Nginx配置Https(详细.完整) 原文链接:请支持原创 前置条件: 在配置https之前请确保下面的步骤已经完成 服务器已经安装nginx并且通过http可以正常访问 不会安装nginx的可以参 ...

  8. 【NOIP2015模拟11.5】JZOJ8月5日提高组T1 俄罗斯套娃

    [NOIP2015模拟11.5]JZOJ8月5日提高组T1 俄罗斯套娃 题目 题解 题意就是说 将1~\(n\)排列,问有多少种方案使得序列的逆序对个数小于\(k\) 很容易想到DP 设\(f[i][ ...

  9. Netty 搭建 WebSocket 服务端

    一.编码器.解码器 ... ... @Autowired private HttpRequestHandler httpRequestHandler; @Autowired private TextW ...

  10. day1(Django)

    1,web项目工作流程 1.1 了解web程序工作流程 1.2 django生命周期   2,django介绍 目的:了解Django框架的作用和特点作用: 简便.快速的开发数据库驱动的网站 Djan ...