Skip to content

Commit

Permalink
First commit
Browse files Browse the repository at this point in the history
  • Loading branch information
Apress committed Oct 25, 2016
0 parents commit d4ea4e5
Show file tree
Hide file tree
Showing 576 changed files with 156,713 additions and 0 deletions.
Binary file added 9781430266945.jpg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
47 changes: 47 additions & 0 deletions Chapter 1/button.html
@@ -0,0 +1,47 @@
<!DOCTYPE html>
<html>
<head>
<title>Button example</title>
<style>
.button {
display: inline-block;
border: 1px solid #1f84ef;
padding: 0px 50px;
line-height: 50px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background: #6db3f2; /* Old browsers */
background: -moz-linear-gradient(top, #6db3f2 0%, #54a3ee 50%, #3690f0 51%, #1e69de 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6db3f2), color-stop(50%,#54a3ee), color-stop(51%,#3690f0), color-stop(100%,#1e69de)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #6db3f2 0%,#54a3ee 50%,#3690f0 51%,#1e69de 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #6db3f2 0%,#54a3ee 50%,#3690f0 51%,#1e69de 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #6db3f2 0%,#54a3ee 50%,#3690f0 51%,#1e69de 100%); /* IE10+ */
background: linear-gradient(to bottom, #6db3f2 0%,#54a3ee 50%,#3690f0 51%,#1e69de 100%); /* W3C */
text-transform: uppercase;
font-family: Impact, "Arial Black", sans serif;
color: #fffffe !important;
font-size: 20px;
font-size: 1.42857rem;
text-decoration: none;
-webkit-font-smoothing: antialiased;
text-shadow: 1px 0px 2px #1f84ef;
filter: dropshadow(color=#1f84ef, offx=1, offy=0);
}

.button:hover, .button:active, .button:focus {
text-decoration: none;
background: #54a7f0; /* Old browsers */
background: -moz-linear-gradient(top, #54a7f0 0%, #3c97ec 50%, #1f84ef 51%, #1c5fcc 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#54a7f0), color-stop(50%,#3c97ec), color-stop(51%,#1f84ef), color-stop(100%,#1c5fcc)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #54a7f0 0%,#3c97ec 50%,#1f84ef 51%,#1c5fcc 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #54a7f0 0%,#3c97ec 50%,#1f84ef 51%,#1c5fcc 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #54a7f0 0%,#3c97ec 50%,#1f84ef 51%,#1c5fcc 100%); /* IE10+ */
background: linear-gradient(to bottom, #54a7f0 0%,#3c97ec 50%,#1f84ef 51%,#1c5fcc 100%); /* W3C */
}
</style>
</head>
<body>
<a href="#" class="button">Call to action</a>
</body>
</html>
9 changes: 9 additions & 0 deletions Chapter 1/date-example.html
@@ -0,0 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<title>Date example</title>
</head>
<body>
<input type="date" id="field" name="field" />
</body>
</html>
12 changes: 12 additions & 0 deletions Chapter 1/email-example.html
@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html>
<head>
<title>Validation example</title>
</head>
<body>
<form>
<input type="email" placeholder="e.g example@example.com" required id="email" name="email" />
<button type="submit">Submit</button>
</form>
</body>
</html>
40 changes: 40 additions & 0 deletions Chapter 1/gradient-panel.html
@@ -0,0 +1,40 @@
<!DOCTYPE html>
<html>
<head>
<title>Gradient panel example</title>
<style>

.panel{
width: 220px;
height: 180px;
padding: 20px;
background: #77b7ef; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, #77b7ef 0%, #000000 100%); /* FF3.6+ */
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#77b7ef), color-stop(100%,#000000)); /* Chrome,Safari4+ */
background: -webkit-radial-gradient(center, ellipse cover, #77b7ef 0%,#000000 100%); /* Chrome10+,Safari5.1+ */
background: -o-radial-gradient(center, ellipse cover, #77b7ef 0%,#000000 100%); /* Opera 12+ */
background: -ms-radial-gradient(center, ellipse cover, #77b7ef 0%,#000000 100%); /* IE10+ */
background: radial-gradient(ellipse at center, #77b7ef 0%,#000000 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#77b7ef', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
background-size: 160% 160%;
background-position: center -160px;
}

.panel h1{
margin-top: 0px;
}

.panel h1, .panel p, .panel a{
color: #fff;
}

</style>
</head>
<body>
<div class="panel">
<h1>Intro</h1>
<p>Cras mattis consectetur purus sit amet fermentum.</p>
<p><a href="#">read more</a></p>
</div>
</body>
</html>
9 changes: 9 additions & 0 deletions Chapter 1/placeholder-example.html
@@ -0,0 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<title>Placeholder example</title>
</head>
<body>
<input type="input" placeholder="Sample placeholder" id="field" name="field" />
</body>
</html>
1 change: 1 addition & 0 deletions Chapter 10/picture-element/.idea/.name

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

23 changes: 23 additions & 0 deletions Chapter 10/picture-element/.idea/compiler.xml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 3 additions & 0 deletions Chapter 10/picture-element/.idea/copyright/profiles_settings.xml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 5 additions & 0 deletions Chapter 10/picture-element/.idea/encodings.xml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 6 additions & 0 deletions Chapter 10/picture-element/.idea/misc.xml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

9 changes: 9 additions & 0 deletions Chapter 10/picture-element/.idea/modules.xml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

10 changes: 10 additions & 0 deletions Chapter 10/picture-element/.idea/picture-element.iml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 5 additions & 0 deletions Chapter 10/picture-element/.idea/scopes/scope_settings.xml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

7 changes: 7 additions & 0 deletions Chapter 10/picture-element/.idea/vcs.xml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit d4ea4e5

Please sign in to comment.