From 07e4a2dafe248280b5610f8c7d09b0f30b530f54 Mon Sep 17 00:00:00 2001 From: Bradley Taunt Date: Mon, 10 Jun 2024 09:41:25 -0400 Subject: Initial modifications to rebuilt only changed files based on mod date, performance updates --- build/posts/first-letter/index.html | 57 +++++++++++++++++++++++++++++++++++++ 1 file changed, 57 insertions(+) create mode 100644 build/posts/first-letter/index.html (limited to 'build/posts/first-letter/index.html') diff --git a/build/posts/first-letter/index.html b/build/posts/first-letter/index.html new file mode 100644 index 0000000..7ea5290 --- /dev/null +++ b/build/posts/first-letter/index.html @@ -0,0 +1,57 @@ + + + + + + + + First Letter Pseudo Element + + + + + + + +
+

First Letter Pseudo Element

+

2019-05-03

+

In today’s TypeTip we will be taking a look at the often overlooked :first-letter CSS pseudo element. Though you might only use this for specific article-format web pages, it’s still a nice-to-have in your web dev toolset.

+

The HTML

+

Like most pseudo elements, nothing has to change with your pre-existing HTML structure:

+
<article>
+    <p>It was a bright cold day in April, and the clocks were striking thirteen.</p>
+</article>
+
+

The CSS

+

Here’s where the magic happens:

+
p:first-letter {
+    color: orangered;
+    font-size: 250%;
+}
+
+

Live CodePen

+

Live CodePen Example

+ \ No newline at end of file -- cgit v1.2.3-54-g00ecf