/*CSS for attribute selectors*/

h2 {
    font-family: arial;
    text-align: center;
}

/* ATTRIBUTE SELECTOR */

input[type] {
    border: 2px solid orangered;
}

/* ATTRIBUTE VALUE */

input[type="text"] {
    background-color: palegreen;
}

input[type="email"] {
    background-color: aqua;
}

input[type="button"] {
    border: 2px solid green;
    background-color: dodgerblue;
    color: white;
    font-weight: bold;
    cursor: pointer;
}

/*Attribute starts with*/

p[title^="e"] {
    color: dodgerblue;
}

/*Attribute ends with*/

p[title$="fox"] {
    color: red;
}

/*Attribute contains word*/

p[title~="quick"] {
    text-decoration: underline;
}