如何用它CSS设置鼠标单击后的样式

html-css010

如何用它CSS设置鼠标单击后的样式,第1张

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html。

2、在index.html中的<style>标签中，输入css代码：a:visited {color: blueviolet}。

3、浏览器运行index.html页面，此时超链接文本单击后的样式被设置了文字紫色颜色。

有2种方式，一种是前台的，一种是后台的

前台的：

做2个超链接，写上对应的事件，根据对应的时间，用js来改写

<link rel="stylesheet" type="text/css" media="screen" href="" />

href里面的值，最后重载一些页面

如果要完善，再把这个值写进cookie里

后台的：

做2个超链接，向后台传2个不同的参数，后台根据不同的参数输出

<link rel="stylesheet" type="text/css" media="screen" href="" />

的href地址

其实换肤就是改变<link rel="stylesheet" type="text/css" media="screen" href="" />的css文件链接地址，没什么难的

CSS3 有一个 :target 属性

这是一个简单的DEMO 高级用法可以再百度搜索：

<!DOCTYPE html>

<html>

<head>

<style>

:target {

    border: 2px solid #D4D4D4

    background-color: #e5eecc

}

</style>

</head>

<body>

<h1>This is a heading</h1>

<p><a href="#news1">Jump to New content 1</a></p>

<p><a href="#news2">Jump to New content 2</a></p>

<p>Click on the links above and the :target selector highlight the current active HTML anchor.</p>

<p id="news1"><b>New content 1...</b></p>

<p id="news2"><b>New content 2...</b></p>

<p><b>Note:</b> Internet Explorer 8 and earlier versions do not support the :target selector.</p>

</body>

</html>