October 2017
Intermediate to advanced
370 pages
8h 57m
English
So we know how to customize the font. What about text layout? CSS can be applied to text in AMP, just like normal HTML. AMP also provides some additional text layout features.
Pull-quotes are quite common in news article content. It's a technique that's used to emphasize an important part of the text. One way to achieve this is by using a simple HTML blockquote tag (/ch3/pullquotes.html):
<blockquote class="pull-quote"> The whale is a mammiferous animal without hind feet</blockquote>
Then we'll add a left border to the quote by adding the following CSS:
.pull-quote { border:none; border-left:6px solid #999; font-size:1.5rem; padding-left:1rem; }
When viewed in a browser, you should see something like this:
Read now
Unlock full access