Home  >  Article  >  Web Front-end  >  Code analysis of links and lists in CSS

Code analysis of links and lists in CSS

不言
不言Original
2018-08-14 14:13:491777browse

The content of this article is about the code analysis of link and list in CSS. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

a:link{
    color: cornflowerblue;
    text-decoration:none;
    background-color: violet;
}
/*link表示链接还没有被点击的状态*/
/*decoration(装饰),控制链接的下划线,当赋值为none没有下划线了*/
/*background-color设置背景颜色*/

a:visited{
    color:forestgreen;
}
/*visited表示已经被点击的状态*/

a:hover{
    color: blueviolet;
}
/*hover表示已经被鼠标滑过的状态*/

a:active{
    color:forestgreen;
}
/*链接正在被点击的状态*/

ul li{
    list-style-type: armenian;
}
/*list-style-type控制标签的显示效果*/

ul li{
    list-style-image: url("1.jpg");
}
/*通过导入本地图片,将标签的前面的标志,替换成想要加入的图片*/

ul.ul1{
    list-style-position:inside;
}
ul.ul2{
    list-style-position: outside;
}
/*该变量控制标签每一项的位置,inside往右边(里边)靠一些,outside往外面靠一些*/

Related recommendations:

HTML5 styles and lists, four states of CSS links_html/css_WEB-ITnose

Html tag usage--text, list, table, hyperlink_html/css_WEB-ITnose

The above is the detailed content of Code analysis of links and lists in CSS. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn