9 kinds of TALLcaps/DROPcaps - Page 2

thiago.eec · 03-03-2020, 06:31 PM

Quote:

Originally Posted by rjwse@aol.com

<body>
<h2>text</h2>
<ol>text</ol>
<p>text</p>
<h2>text</h2>
<img />
<p>text</p>
</body>

h2 ~ p:first-of-type{} will change only first p.
(h2 ~ p):first-of-type {} would change all p's (it's a 'reset') but css does not allow.
Instead, add class="h" to all H2s and
.h ~ p:first-of-type {} and this will change both p's.
no such thing as first-of-class either.
The other way to accomplish both p's being changed is to split the xhtml segment into two to isolate the H2s.

Shazam!

If we think of real books, it is common to see a certain pattern for headings. So, you could use something like this to create dropcaps, without using classes:

Code:

h1 + p::first-letter {
  font-size: 3.5em;
  float: left;
  line-height: 1em;
  margin-bottom: -0.284em;
  margin-right: 0.05em;
  margin-top: -0.16em;
}

If you have something else after the h1, maybe an hr, or an img, just add it:

Code:

h1 + hr + p::first-letter {
  css code here
}

This would work on multiple h2 on a single file either, as long as they all follow the pattern.

rjwse@aol.com · 03-03-2020, 08:44 PM

I find it very easy to use Regex to find and replace all first letters at the beginning of each chapter.
................
That sounds good. Can you share?

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Would these dropcaps work for Kindle formats?	Klip	Kindle Formats	0	04-11-2014 02:30 AM
Alphabet for DropCaps	crutledge	Workshop	23	12-05-2013 03:34 PM
AZW3 and dropcaps	Jeff L	Conversion	9	01-21-2013 09:12 PM
Dropcaps code wanted	JSWolf	ePub	22	09-19-2012 02:31 AM
CSS / dropcaps	Oldpilot	Sigil	49	09-17-2012 09:44 AM

03-03-2020, 08:44 PM	#17
rjwse@aol.com Addict Posts: 283 Karma: 2228060 Join Date: Dec 2013 Location: LaVernia, Texas Device: kindle epub readers on android	I find it very easy to use Regex to find and replace all first letters at the beginning of each chapter. ................ That sounds good. Can you share?

Advert