Renders best in Chrome.
This technique does work in Firefox, but text stroke is not supported.
A Pen by Wayne Lippold on CodePen.
<!DOCTYPE html> | |
<html> | |
<head><title>HTML Attribute Exercises</title></head> | |
<body> | |
<h1>HTML Attribute Exercises</h1> | |
<ol> | |
<!-- 1. Add a tooltip to the paragraph below with the text "About HSArtsTech.org". |
/** | |
* The first commented line is your dabblet’s title | |
*/ | |
background: #f06; | |
background: linear-gradient(45deg, #f06, yellow); | |
min-height: 100%; |
Renders best in Chrome.
This technique does work in Firefox, but text stroke is not supported.
A Pen by Wayne Lippold on CodePen.
<div class="quote"> | |
<span class="line1">If you haven’t</span> | |
<span class="line2">surprised</span> | |
<span class="line3">yourself yet,</span> | |
<span class="line4">you haven’t done</span> | |
<span class="line5">enough</span> | |
<span class="line6">sketching</span> | |
<cite>—Josh Collinsworth</cite> | |
</div> |
dfg |
<html> | |
<head> | |
<link rel='stylesheet' type='text/css' href='http://fonts.googleapis.com/css?family=Quicksand:300,400'> | |
<style> | |
body { | |
font-size: 16px; | |
background: #ecf0f1; | |
font-family: 'Quicksand', sans-serif; | |
} |
<html> | |
<head> | |
<link rel='stylesheet' type='text/css' href='http://fonts.googleapis.com/css?family=Quicksand:300,400'> | |
<style> | |
body { | |
font-size: 16px; | |
background: #ecf0f1; | |
font-family: 'Quicksand', sans-serif; | |
} |
<!-- Ui inspired from this : https://dribbble.com/shots/1044569-Music-Player-Concept --> | |
<script type="text/javascript" src='//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> | |
<script> | |
"use strict"; | |
$(document).ready(function() { | |
var songs = [{ | |
"title": "Misses", | |
"artist": "Girls in Hawaii", | |
"cover": "http://bloo.ovh/music-player/img/Girls in Hawaii.jpeg", | |
"num": "0", |