Word Cloud
This a very simple Word Cloud. Create using only HTML and CSS. 110 word included, randomly selected but related with computers, networking, and web.
Ten font sizes used, 12px to 21px. Font sizes assigned to words randomly. On mouse hover font color, background color, and mouse point has set to change using CSS.
Accident
Adobe
Annuity
Attorney
Auto
Best
Business
California
Car
Cash
Center
Cloud
Code
Colorado
Company
Cookie
County
Dallas
data
Denver
DOS
download
email
Facebook
firewall
Firm
Florida
format
freeware
FTP
Gmail
Google
hacker
hard
disk
hardware
Houston
HTML
Injury
Insurance
Internet
Java
keyword
laptop
Law
Lawsuit
Lawyer
Linux
Los
Angeles
Mac
OS
Malware
Mesothelioma
Microsoft
Modem
Mouse
Motorcycle
Mozilla
Firefox
Newport
Beach
notebook
Online
Payment
PC
PDF
Personal
Phoenix
Phone
PHP
printer
program
Provider
Quote
RAM
ROM
San
Diego
scan
search
engine
security
Sell
Selling
server
Service
Settlement
sharing
Small
software
spam
spyware
Structure
Structured
System
Telephone
Trojan
Truck
Ubuntu
Update
upload
USB
version
virtual
virus
Web
Windows
Yahoo!
ZIP
HTML and CSS codes of Word Cloud as follows,
<html>
<head>
<style type="text/css">
#cloud {color:#151B8D; line-height:24px; text-align:center;}
.mouseon:hover {background-color: blue; color: white; cursor:pointer;}
.word01 {font-size:12px;}
.word02 {font-size:13px;}
.word03 {font-size:14px;}
.word04 {font-size:15px;}
.word05 {font-size:16px;}
.word06 {font-size:17px;}
.word07 {font-size:18px;}
.word08 {font-size:19px;}
.word09 {font-size:20px;}
.word10 {font-size:21px;}
</style>
</head>
<body>
<div id="cloud">
<span class="word09 mouseon"> Accident </span>
<span class="word07 mouseon"> Adobe </span>
<span class="word09 mouseon"> Annuity </span>
<span class="word01 mouseon"> Attorney </span>
<span class="word10 mouseon"> Auto </span>
<span class="word06 mouseon"> Best </span>
<span class="word07 mouseon"> Business </span>
<span class="word09 mouseon"> California </span>
<span class="word05 mouseon"> Car </span>
<span class="word08 mouseon"> Cash </span>
<span class="word03 mouseon"> Center </span>
<span class="word06 mouseon"> Cloud </span>
<span class="word04 mouseon"> Code </span>
<span class="word06 mouseon"> Colorado </span>
<span class="word09 mouseon"> Company </span>
<span class="word04 mouseon"> Cookie </span>
<span class="word09 mouseon"> County </span>
<span class="word03 mouseon"> Dallas </span>
<span class="word07 mouseon"> data </span>
<span class="word06 mouseon"> Denver </span>
<span class="word07 mouseon"> DOS </span>
<span class="word05 mouseon"> download </span>
<span class="word03 mouseon"> email </span>
<span class="word07 mouseon"> Facebook </span>
<span class="word02 mouseon"> firewall </span>
<span class="word09 mouseon"> Firm </span>
<span class="word08 mouseon"> Florida </span>
<span class="word02 mouseon"> format </span>
<span class="word05 mouseon"> freeware </span>
<span class="word10 mouseon"> FTP </span>
<span class="word01 mouseon"> Gmail </span>
<span class="word08 mouseon"> Google </span>
<span class="word01 mouseon"> hacker </span>
<span class="word09 mouseon"> hard </span>
<span class="word02 mouseon"> disk </span>
<span class="word03 mouseon"> hardware </span>
<span class="word07 mouseon"> Houston </span>
<span class="word04 mouseon"> HTML </span>
<span class="word02 mouseon"> Injury </span>
<span class="word04 mouseon"> Insurance </span>
<span class="word10 mouseon"> Internet </span>
<span class="word01 mouseon"> Java </span>
<span class="word07 mouseon"> keyword </span>
<span class="word02 mouseon"> laptop </span>
<span class="word04 mouseon"> Law </span>
<span class="word10 mouseon"> Lawsuit </span>
<span class="word03 mouseon"> Lawyer </span>
<span class="word10 mouseon"> Linux </span>
<span class="word03 mouseon"> Los </span>
<span class="word06 mouseon"> Angeles </span>
<span class="word05 mouseon"> Mac </span>
<span class="word02 mouseon"> OS </span>
<span class="word04 mouseon"> Malware </span>
<span class="word07 mouseon"> Mesothelioma </span>
<span class="word10 mouseon"> Microsoft </span>
<span class="word05 mouseon"> Modem </span>
<span class="word01 mouseon"> Mouse </span>
<span class="word06 mouseon"> Motorcycle </span>
<span class="word02 mouseon"> Mozilla </span>
<span class="word06 mouseon"> Firefox </span>
<span class="word08 mouseon"> Newport </span>
<span class="word05 mouseon"> Beach </span>
<span class="word10 mouseon"> notebook </span>
<span class="word08 mouseon"> Online </span>
<span class="word09 mouseon"> Payment </span>
<span class="word01 mouseon"> PC </span>
<span class="word08 mouseon"> PDF </span>
<span class="word05 mouseon"> Personal </span>
<span class="word04 mouseon"> Phoenix </span>
<span class="word05 mouseon"> Phone </span>
<span class="word10 mouseon"> PHP </span>
<span class="word01 mouseon"> printer </span>
<span class="word08 mouseon"> program </span>
<span class="word01 mouseon"> Provider </span>
<span class="word04 mouseon"> Quote </span>
<span class="word03 mouseon"> RAM </span>
<span class="word08 mouseon"> ROM </span>
<span class="word06 mouseon"> San </span>
<span class="word01 mouseon"> Diego </span>
<span class="word09 mouseon"> scan </span>
<span class="word05 mouseon"> search </span>
<span class="word08 mouseon"> engine </span>
<span class="word03 mouseon"> security </span>
<span class="word01 mouseon"> Sell </span>
<span class="word06 mouseon"> Selling </span>
<span class="word10 mouseon"> server </span>
<span class="word08 mouseon"> Service </span>
<span class="word02 mouseon"> Settlement </span>
<span class="word07 mouseon"> sharing </span>
<span class="word10 mouseon"> Small </span>
<span class="word02 mouseon"> software </span>
<span class="word09 mouseon"> spam </span>
<span class="word08 mouseon"> spyware </span>
<span class="word04 mouseon"> Structure </span>
<span class="word01 mouseon"> Structured </span>
<span class="word05 mouseon"> System </span>
<span class="word06 mouseon"> Telephone </span>
<span class="word03 mouseon"> Trojan </span>
<span class="word07 mouseon"> Truck </span>
<span class="word03 mouseon"> Ubuntu </span>
<span class="word02 mouseon"> Update </span>
<span class="word04 mouseon"> upload </span>
<span class="word09 mouseon"> USB </span>
<span class="word05 mouseon"> version </span>
<span class="word10 mouseon"> virtual </span>
<span class="word06 mouseon"> virus </span>
<span class="word03 mouseon"> Web </span>
<span class="word07 mouseon"> Windows </span>
<span class="word02 mouseon"> Yahoo! </span>
<span class="word04 mouseon"> ZIP </span>
</div>
</body>
</head>