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>