精灵饭饭

常用标签整理

1.文本框鼠标/焦点处理

<input type="text" name="userid" value="USERNAME" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'USERNAME';}">

2.三角形图表fontawesone/纯css

链接http://fontawesome.dashgame.com/

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<link href="font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet">

<title></title>

<style type="text/css">
.demo{
position: relative;
}
.demo:after {
border: 10px solid transparent;
border-left: 10px solid #f00;
width: 0;
height: 0;
position: absolute;
content: ' '
}

</style>

.demo{
position: relative;
}
.demo:after {
border: 10px solid transparent;
border-left: 10px solid #f00;
width: 0;
height: 0;
position: absolute;
content: ' '
}

</head>

<body>

<span class="demo">文字内容</span>

::after

<ul>

<i class="fa fa-caret-right"></i>

</ul>

</body>

 

posted on 2016-11-24 10:39  精灵饭饭  阅读(155)  评论(0编辑  收藏  举报