有什么解决方案吗，我需要从style标记到style="；，下面的代码在我打开它时有效，但在我发布它时不起作用。我在webflow中制作网站，所以我需要把代码放在HTML嵌入中，这就是为什么我需要把所有这些都放在HTML中。如果有人帮助我，我将不胜感激。
代码：
<style type="text/css">
@media only screen and (max-width: 1000px) and (min-width: 600px) {
.linkTextingInner, #linkTexting_form {
width: 453px;
}
.linkTextingInput, #numberToText_linkTexting {
width: 309px;
padding: 0 70px;
}
.linkTextingButton, #sendButton_linkTexting {
width: 124px;
font-size: 13px;
}
}
@media only screen and (max-width: 600px) and (min-width: 400px) {
.linkTextingInner, #linkTexting_form {
width: 360px;
height: 55px;
}
.linkTextingInput, #numberToText_linkTexting {
width: 230px;
padding: 0 60px;
height: 41px;
font-size: 18px;
}
.linkTextingButton, #sendButton_linkTexting {
width: 110px;
font-size: 11px;
height: 41px;
}
}
@media only screen and (max-width: 400px) {
.linkTextingInner, #linkTexting_form {
width: 320px;
height: 55px;
}
.linkTextingInput, #numberToText_linkTexting {
width: 190px;
padding: 0 40px;
height: 41px;
font-size: 14px;
}
.linkTextingButton, #sendButton_linkTexting {
width: 110px;
font-size: 10px;
height: 41px;
}
}
@media only screen and (max-width: 350px) {
.linkTextingInner, #linkTexting_form {
width: 280px;
height: 55px;
}
.linkTextingInput, #numberToText_linkTexting {
width: 160px;
padding: 0 20px;
height: 41px;
font-size: 14px;
}
.linkTextingButton, #sendButton_linkTexting {
width: 100px;
font-size: 10px;
height: 41px;
}
}
</style>
</head>
<body>
<div class="badgeContainer badge-2">
<div class="linkTextingWidgetWrapper">
<div class="linkTextingWidget">
<div class="promptContent"></div>
<div class="linkTextingInner" id="linkTexting_form" style="display: flex;
flex-flow: row wrap;
align-items: center;
background-color: white;
width: 533px;
height: 65px;
border-radius: 50px;">
<input type="hidden" class="linkID" value="8853c16d-94ac-47d1-8e3a-
c58d4e688901">
<div class="linkTextingInputWrapper">
<input class="linkTextingInput linkTextingInputFlagAdjust" type="tel"
id="numberToText_linkTexting"
style="vertical-align: middle;
padding: 0 100px;
background-color: #fff;
border: 0;
width: 369px;
height: 51px;
margin-left: 10px;
border-radius: 50px;
font-size: 25px;
font-family: ProximaNova;">
</div>
<button class="linkTextingButton localized-button localized-text
text_me_a_link"
type="button"
id="sendButton_linkTexting" style="padding: 10px 20px;
background-color: #355dee;
color: white;
border-radius: 50px;
width: 144px;
cursor: pointer;
height: 51px;
border: 0;
font-size: 16px;
font-family: ProximaNova;">Text me a Link</button>
<div class="linkTextingError" id="linkTextingError" style="display:none;">
</div>
</div>
</div>
</div>
</div>
您不能，但我有两个选项供您选择
ClassJss
Jss:JSS是CSS的创作工具，允许您使用JavaScript以声明性、无冲突和可重用的方式描述样式。它可以在浏览器、服务器端或Node中的构建时进行编译。
读取文档
规范：由于样式不一致，您的代码可能无法工作。我指的是您为Media Query load before the main styles定义的样式
删除style标记中的类型，并使用此
<style scoped>
@media only screen and (max-width: 1000px) and (min-width: 600px) {
.linkTextingInner, #linkTexting_form {
width: 453px;
}
</style>