错误:需要css冒号(需要css- colon )
错误:需要css冒号(需要css- colon )
提问于 2019-05-30 19:51:43
我正在尝试创建一个简单的angular项目。在css文件/src/styles.css中，在编写代码时，我遇到了语法错误。
body {
margin: 0;
background: #F2F2F2;
font-family: 'Montserrat', sans-serif;
height: 100vh;
}
#container { display: grid;
grid-template-columns: 70px auto;
height: 100%;
#content {
padding: 30px 50px;
ul {//error highlight saying: colon expected css(css-colonexpected)
list-style-type: none;
margin:0;padding:0;
li {
background: #fff;
border-radius: 8px;
padding: 20px;
margin-bottom: 8px;
a {
font-size: 1.5em;
text-decoration: none;
font-weight: bold;
color:#00A8FF;
}
ul {
margin-top: 20px;
li {
padding:0;
a {
font-size: 1em;
font-weight: 300;
}//Error highlight saying: at-rule or selector expected css(css-ruleselectorexpected)
}
}
}
}
}
}错误消息显示为注释
显示的语法错误为：-colon expected css(css-colonexpected)
-在规则或选择器应为css(应为css-ruleselectorexpected)
回答 2
Stack Overflow用户
回答已采纳
发布于 2019-05-30 20:09:04
您在.css文件中使用的是带有嵌套类的有效SASS或SCSS，因此会显示错误。等效的css为：
body {
margin: 0;
background: #F2F2F2;
font-family: "Montserrat", sans-serif;
height: 100vh;
}
#container {
display: grid;
grid-template-columns: 70px auto;
height: 100%;
}
#container #content {
padding: 30px 50px;
}
#container #content ul {
list-style-type: none;
margin: 0;
padding: 0;
}
#container #content ul li {
background: #fff;
border-radius: 8px;
padding: 20px;
margin-bottom: 8px;
}
#container #content ul li a {
font-size: 1.5em;
text-decoration: none;
font-weight: bold;
color: #00A8FF;
}
#container #content ul li ul {
margin-top: 20px;
}
#container #content ul li ul li {
padding: 0;
}
#container #content ul li ul li a {
font-size: 1em;
font-weight: 300;
}Stack Overflow用户
发布于 2019-05-30 20:10:11
您正在CSS文件中使用sass。所以显示了这个错误。其文件扩展名应为.sass或样式表应根据CSS语法进行编码。
在CSS中，它类似于：
body {
margin: 0;
background: #F2F2F2;
font-family: "Montserrat", sans-serif;
height: 100vh;
}
#container {
display: grid;
grid-template-columns: 70px auto;
height: 100%;
}
#container #content {
padding: 30px 50px;
}
#container #content ul {
list-style-type: none;
margin: 0;
padding: 0;
}
#container #content ul li {
background: #fff;
border-radius: 8px;
padding: 20px;
margin-bottom: 8px;
}
#container #content ul li a {
font-size: 1.5em;
text-decoration: none;
font-weight: bold;
color: #00A8FF;
}
#container #content ul li ul {
margin-top: 20px;
}
#container #content ul li ul li {
padding: 0;
}
#container #content ul li ul li a {
font-size: 1em;
font-weight: 300;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56377790
复制相关文章
相似问题
腾讯云开发者
