我需要的css动画的整个代码和项目符号后，在字符串换行。还需要对循环时间进行控制

对于需要的CSS动画的整个代码和项目符号后，在字符串换行，可以使用以下代码实现：

<!DOCTYPE html>
<html>
<head>
<style>
@keyframes example {
  0%   {background-color:red; left:0px; top:0px;}
  25%  {background-color:yellow; left:200px; top:0px;}
  50%  {background-color:blue; left:200px; top:200px;}
  75%  {background-color:green; left:0px; top:200px;}
  100% {background-color:red; left:0px; top:0px;}
}

div {
  width: 100px;
  height: 100px;
  position: relative;
  animation-name: example;
  animation-duration: 4s;
  animation-iteration-count: infinite;
}
</style>
</head>
<body>

<h1>CSS Animation</h1>

<div></div>

</body>
</html>

这段代码实现了一个简单的CSS动画效果。通过@keyframes定义了动画的关键帧，通过div元素的样式属性和动画属性来控制动画的效果。其中animation-duration属性控制了动画的循环时间，单位为秒。通过设置animation-iteration-count属性为infinite，可以使动画无限循环。

如果需要在字符串换行，可以使用\n来表示换行符。例如：

<!DOCTYPE html>
<html>
<head>
<style>
@keyframes example {
  0%   {background-color:red; left:0px; top:0px;}
  25%  {background-color:yellow; left:200px; top:0px;}
  50%  {background-color:blue; left:200px; top:200px;}
  75%  {background-color:green; left:0px; top:200px;}
  100% {background-color:red; left:0px; top:0px;}
}

div {
  width: 100px;
  height: 100px;
  position: relative;
  animation-name: example;
  animation-duration: 4s;
  animation-iteration-count: infinite;
}
</style>
</head>
<body>

<h1>CSS Animation</h1>

<div></div>

<script>
var code = `@keyframes example {
  0%   {background-color:red; left:0px; top:0px;}
  25%  {background-color:yellow; left:200px; top:0px;}
  50%  {background-color:blue; left:200px; top:200px;}
  75%  {background-color:green; left:0px; top:200px;}
  100% {background-color:red; left:0px; top:0px;}
}\n
div {
  width: 100px;
  height: 100px;
  position: relative;
  animation-name: example;
  animation-duration: 4s;
  animation-iteration-count: infinite;
}`;

console.log(code);
</script>

</body>
</html>

在上面的代码中，通过JavaScript将CSS代码存储在变量code中，并使用console.log输出到控制台。其中\n表示换行符。

希望以上代码能满足您的需求。如果有任何问题，请随时提问。