Skip to content

Commit 46e1129

Browse files
authored
Merge branch 'master' into python-pyqt-tutorial-update
2 parents 153fde2 + 667cdd4 commit 46e1129

File tree

20 files changed

+374
-0
lines changed

20 files changed

+374
-0
lines changed

html-css-python/README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# HTML and CSS for Python Developers
2+
3+
Supplemental materials for the [tutorial on HTML and CSS for Python Developers](https://realpython.com/html-css-python/) hosted on Real Python.
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>HTML Boilerplate</title>
6+
<link rel="stylesheet" href="style.css">
7+
</head>
8+
<body>
9+
10+
<!-- Your Content -->
11+
12+
</body>
13+
</html>
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/* Add your CSS styles in this file */
Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>My favorite emoji</title>
6+
<link rel="stylesheet" href="https://cdn.simplecss.org/simple.css">
7+
<link rel="stylesheet" href="style.css">
8+
</head>
9+
<body>
10+
<nav>
11+
<a href="index.html">Home</a>
12+
<a href="images/gallery.html">Gallery</a>
13+
</nav>
14+
<h1>My favorite emoji</h1>
15+
<p>I don't just <em>like</em> emoji,<br>
16+
I <strong>love</strong> emoji!</p>
17+
<p>Here's a table of my most-used emoji:</p>
18+
<table>
19+
<thead>
20+
<tr><th>#</th><th>Emoji</th><th>Name</th></tr>
21+
</thead>
22+
<tbody>
23+
<tr><td>1.</td><td>🐞</td><td>Lady Beetle</td></tr>
24+
<tr><td>2.</td><td>🐍</td><td>Snake</td></tr>
25+
<tr><td>3.</td><td>👍</td><td>Thumbs Up Sign</td></tr>
26+
<tr><td>4.</td><td>🎉</td><td>Party Popper</td></tr>
27+
<tr><td>5.</td><td>🤩</td><td>Grinning Face With Star Eyes</td></tr>
28+
<tr><td>6.</td><td>😂</td><td>Face With Tears Of Joy</td></tr>
29+
<tr><td>7.</td><td>🐶</td><td>Dog Face</td></tr>
30+
<tr><td>8.</td><td>🍿</td><td>Popcorn</td></tr>
31+
<tr><td>9.</td><td>😎</td><td>Smiling Face With Sunglasses</td></tr>
32+
<tr><td>10.</td><td></td><td>Sparkles</td></tr>
33+
<tr><td>11.</td><td>💬</td><td>Speech Balloon</td></tr>
34+
<tr><td>12.</td><td>😘</td><td>Face Throwing A Kiss</td></tr>
35+
</tbody>
36+
</table>
37+
</body>
38+
</html>
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="utf-8">
6+
<title>Image gallery</title>
7+
<link rel="stylesheet" href="https://cdn.simplecss.org/simple.css">
8+
<link rel="stylesheet" href="../style.css">
9+
</head>
10+
11+
<body>
12+
<nav>
13+
<a href="../index.html">Home</a>
14+
<a href="../emoji.html">Emoji</a>
15+
</nav>
16+
<h1>Image gallery</h1>
17+
<div class="gallery rounded">
18+
<img src="sky_1.png" alt="Cloudy sky." class="rounded">
19+
<img src="sky_2.png" alt="Sun shining through a cloudy sky." class="rounded">
20+
<img src="sky_3.png" alt="Sky with almost no clouds." class="rounded">
21+
</div>
22+
</body>
23+
24+
</html>
355 KB
Loading
625 KB
Loading
647 KB
Loading
Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Hello, World!</title>
6+
<link rel="stylesheet" href="https://cdn.simplecss.org/simple.css">
7+
<link rel="stylesheet" href="style.css">
8+
</head>
9+
<body>
10+
<nav>
11+
<a href="emoji.html">Emoji</a>
12+
<a href="images/gallery.html">Gallery</a>
13+
</nav>
14+
<h1>Hello, World Wide Web!</h1>
15+
<p>This is my first website.</p>
16+
17+
<h2>About me</h2>
18+
<p>I'm a Python programmer and bug collector.</p>
19+
20+
<h2>Links</h2>
21+
<p>My favorite websites are:</p>
22+
<ul>
23+
<li><a href="https://www.realpython.com">realpython.com</a></li>
24+
<li><a href="https://www.python.org">python.org</a></li>
25+
<li><a href="https://www.pypi.org">pypi.org</a></li>
26+
<ul>
27+
</body>
28+
</html>
Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
body {
2+
background-color: rgb(20, 40, 60);
3+
color: rgb(240, 248, 255);
4+
font-family: "Helvetica", "Arial", sans-serif;
5+
font-size: 1.3em;
6+
}
7+
8+
a {
9+
color: rgb(255, 111, 111);
10+
}
11+
12+
.gallery {
13+
background: rgba(255, 255, 255, 0.2);
14+
padding: 1em;
15+
}
16+
17+
.rounded {
18+
border-radius: 15px;
19+
}
20+
21+
.gallery img {
22+
margin-right: 0.2em;
23+
width: 150px;
24+
}
25+
26+
th,
27+
tr:nth-child(even) {
28+
background-color: rgba(255, 255, 255, 0.2);
29+
}
30+
31+
td:nth-child(1) {
32+
text-align: right;
33+
}
34+
35+
td:nth-child(2) {
36+
text-align: center;
37+
}

0 commit comments

Comments
 (0)