如何将CSS组合在一个类中，使其可用于Blogger模板

Question

我正在尝试创建HTML/CSS的文本框混合物。我有用于设计文本框的CSS代码。我想在博客中使用此代码，但我无法将 CSS 组合在一个类中以便在博客中使用。请有人帮我。谢谢。
CSS 和 HTML：

body {
	background-color: #f1f1f1;
	font-family: Helvetica,Arial,Verdana;
}
.link-box,.link-wrapper {
	position: relative;
	padding: 10px;
}
.link-wrapper {
	width: 500px;
	margin: auto;
	margin-top: 50px;
}
.link-box {
	width: 80%;
	border: 1px solid #ccc;
  outline: 0;
  border-radius: 15px;
}
.link-box:focus {
	box-shadow: 0 0 15px 5px #b0e0ee;
	border: 1px solid #0AA700;
}

<div class="link-wrapper">
	<input type="text" onClick="this.select();" name="focus" required class="link-box" value="www.google.com"  readonly/>
</div>

Answer 1

不完全是你所说的一个类的意思。但是，如果您的意思是只能在父div 上有一个类，而不是在输入上，这将起作用。

.link-wrapper {
  position: relative;
  width: 500px;
  margin: auto;
  margin-top: 50px;
  padding: 10px;
}
.link-wrapper input {
  width: 80%;
  border: 1px solid #ccc;
  outline: 0;
  border-radius: 15px;
  padding: 10px;
}
.link-wrapper input:focus {
  box-shadow: 0 0 15px 5px #b0e0ee;
  border: 1px solid #0AA700;
}