在键入下一个span项目之前，为javascript创建新行的键入效果

Question

我的java脚本的这一部分创建了一个样式元素，其作用类似于我的网站上的类型编写器css效果。出于某种原因，当它更改span项时，style元素会在原始行再次键入之前转到新行。见图。

HTML

<h1>Hi, Im Roshni. My skills include
<span
 class="txt-rotate"
 data-period="2000"
 data-rotate='["T-SQL.", "HTML5.", "CSS.", "C#.", "SSRS & SQL-RD.", "Sharepoint Designer.", "Java.", "MySQL."]'></span>
</h1>

的javascript：

  // INJECT CSS
  var css = document.createElement("style");
  css.type = "text/css";
  css.innerHTML += ".txt-rotate > .wrap { border-right: 0.08em solid #666 }";
  document.body.appendChild(css);
};

Answer 1

span {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  padding: 1px 5px 3px 0px;
}

似乎有效。