王树贤 WangShuXian6

CSS-only Weather App Concept

Dribbble rework of an original shot by Sergey Valiukh.

A Pen by David Khourshid on CodePen.

License.

Day 001 Login Form

Design is based from dribble.com http://dribbble.com/shots/2125879-Day-001-Login-Form

A Pen by Mohan Khadka on CodePen.

License.

单标签左边竖条的实现方式

A Pen by 王树贤 on CodePen.

License.

Day One (Pure CSS)

Just a simple card flip, toggled by a :checked input field! Feedback welcome -- how can I improve? Thanks for looking. (Okay it's not technically pure CSS but all the JS does is toggle the checkbox with a keypress, so...)

A Pen by Henry Desroches on CodePen.

License.

CSS Only Diwali Fireworks (Box Shadows)

A Pen by 王树贤 on CodePen.

License.

	<div class="container">
	<h2>Click the hotspots to make Huggy Laser Pandas</h2>
	<div class="size">Size the browser window down horizontally</div>
	<svg class="first" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 468.4">
	<path fill="#FFF" d="M299.7 150v-39.9c0-2.7-2.2-4.9-4.9-4.9h-39.4v-.7h39.4c3.1 0 5.6 2.5 5.6 5.6V150h-.7z" />
	<path fill-rule="evenodd" clip-rule="evenodd" fill="#4E3440" d="M225.3 20.9h1.2v68.9h-1.2zM231.9 112.4h2.3v161.7h-2.3z" />
	<path fill="#FFF" d="M330.1 211.9v-6.8c0-2.7-2.2-4.9-4.9-4.9h-9.3v-.7h9.3c3.1 0 5.6 2.5 5.6 5.6v6.8h-.7z" />
	<path fill="#4E3440" d="M298.9 167h2.3v4.8h-2.3z" />
	<path fill-rule="evenodd" clip-rule="evenodd" fill="#EAEAEA" d="M321.3 193.2c0 11.9-9.6 21.5-21.5 21.5s-21.5-9.6-21.5-21.5 9.6-21.5 21.5-21.5 21.5 9.6 21.5 21.5z" />
	<path fill-rule="evenodd" clip-rule="evenodd" fill="#FFF" d="M284.5 178c-8.4 8.4-8.4 22 0 30.4l30.4-30.4c-8.4-8.4-22-8.4-30.4 0z" />

	<div class="holder">

	<h1>Mozilla-like Buttons</h1>

	<button class="button">Button</button>
	<button class="back">Back</button>
	<button class="site">2</button>
	<button class="site">1</button>

	</div>

	<h1>Pure CSS One Div Weather Animated Icons</h1>
	<div id="fabrizio"></div>
	<a href="http://fabrizio.co">fabrizio.co</a>

	<div class="container">
	<div class="sunny"></div>
	<div class="cloudy"></div>
	<div class="rainy"></div>
	<div class="snowy"></div>
	<div class="rainbow"></div>

	<!DOCTYPE html>
	<html lang="en">

	<head>
	<meta charset="utf-8">

	<title>Login</title>

	<meta name="viewport" content="width=device-width, initial-scale=1">

	<div class="log-form">
	<h2>Login to your account</h2>
	<form>
	<input type="text" title="username" placeholder="username" />
	<input type="password" title="username" placeholder="password" />
	<button type="submit" class="btn">Login</button>
	<a class="forgot" href="#">Forgot Username?</a>
	</form>
	</div><!--end log form -->