<input type="text" placeholder="nothing" title="google" required>
内部CSS文件:
input[type="text"]{
border: 2px solid red;
}
input::placeholder{
color:green;
}
input[title="google"]{
background-color:black;
color:white;
}
为什么type、placeholder和title的编写过程不同?虽然标签内的文字看起来是一样的。如何理解哪些是属性,哪些是元素?
2条答案
按热度按时间uklbhaso1#
input::placeholder
选择<input>
的占位符,而input[attribute="value"]
选择<input>
,其属性值为value。它们有不同的功能。可视化示例:
注意:这个答案是从一个评论转换而来的,因为我找不到任何重复的目标。
r8xiu3jd2#
在CSS中,我们有属性选择器和伪元素,它们有不同的用途和不同的语法。让我们了解它们的区别以及如何识别它们:
要区分属性选择器和伪元素,请执行以下操作:
在CSS代码中,选择器input[type=“text”]、input[title=“google”]和input::placeholder分别针对元素的不同方面:
通过使用这些选择器,我们可以根据元素的属性或状态将独特的样式应用于特定的元素或元素的部分。