css超链接颜色

文字颜色为蓝色

/* 链接的默认状态 */
a {
color: blue;  /* 文字颜色为蓝色 */
text-decoration: none;  /* 文字下划线去掉 */
}

鼠标悬停在链接上时文字颜色为红色

/* 鼠标悬停在链接上时的状态 */
a:hover {
color: red;  /* 文字颜色为红色 */
text-decoration: underline;  /* 文字下划线加上 */
}

点击链接后文字颜色为绿色

/* 点击链接后的状态 */
a:active {
color: green;  /* 文字颜色为绿色 */
text-decoration: underline;  /* 文字下划线加上 */
}

完整的，默认，点击，悬停，点击后颜色

/* 设置超链接的默认颜色 */
a {
color: blue;
}
/* 设置已访问过的超链接颜色 */
a:visited {
color: purple;
}
/* 设置鼠标悬停在超链接上时的颜色 */
a:hover {
color: red;
}
/* 设置超链接在被点击时的颜色 */
a:active {
color: orange;
}

护眼色CSS代码

body {
background-color: #f8efe8; //米黄色背景
color: #515151; //深灰色文字
}

米黄色背景和深灰色文字组合，让人感觉温暖、柔和，有助于缓解眼睛疲劳。

body {
background-color: #e8f6f3; //淡蓝色背景
color: #333; //黑色文字
}

淡蓝色背景和黑色文字组合，看起来清新舒适，可以有效减轻眼睛的疲劳。

body {
background-color: #fffbf0; //浅黄色背景
color: #333; //黑色文字
}

浅黄色背景和黑色文字组合看起来舒适，不容易造成视觉疲劳。

body {
background-color: #f1f1f1; //浅灰色背景
color: #222; //深色文字
}