English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
表示具有以attribute命名的属性的元素，属性值为“value”或以“value-”表示前缀（"-"表示连字符，Unicode编码为U+002D) 开始。典型的应用场景是用于匹配语言简写代码（如zh-CN, zh-TW puede usar zh como value).
Manual de referencia de selector CSS completo
Selector de estilo para elementos cuyos valores de atributo de lang comiencen con "en":
!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Guía básica (oldtoolbag.com)</title>
<style>
[lang|=en]
{
background:yellow;
}
</style>
</head>
<body>
<p lang="en">Hello!</p>
<p lang="en-us">Hi!</p>
<p lang="en-<p lang="gb">Ello!</p>
<p lang="us">Hi!</p>
<p lang="no">Hei!</p>
<p><b>Nota:</b>Si [<i>attribute</i>~=<i>value</i>] para IE8 y versiones anteriores, DOCTYPE es obligatorio declarar.</p>
</body>
</html>Prueba y mira ‹/›[attribute|=value] selector se utiliza para seleccionar elementos cuyos valores de atributo comiencen con un valor especificado.
Nota:Este valor es toda la palabra, ya sea sola como lang="en", o como guiones - Como lang=en-us pueden hacerlo.
IEFirefoxOperaChromeSafari
Todos los navegadores principales soportan [attribute|=value] selector.
Nota: [attribute|=value] en IE8Para ejecutarse en IE, debe declararse!DOCTYPE
Tutorial CSS: Selector de atributo CSS
Elije un elemento de clase que comience con top y hazlo rojo:
!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Guía básica (oldtoolbag.com)</title>
<style>
[class|=top]
{
background:red;
color:white;
}
</style>
</head>
<body>
<h1 class="top-header">Bienvenido</h1>
<p class="top-text">¡Hola, mundo!</p>
<p class="content">¿Estás aprendiendo CSS?</p>
</body>
</html>Prueba y mira ‹/›