Alonz-y.css Basic Typography Demo

We can use class="lead-intro" to create a larger intro paragraph. For this demo, I'm using the font Karla, and wrote some basic extra styles for colors and paragraph width.

Lorem ipsum dolor sit amet. Quo rerum ullam qui voluptatum earum sit consequatur laborum et voluptatem nihil ea enim dolorem. Eum sequi atque id corrupti quam aut debitis dolore.

Eos dolor labore id pariatur delectus et labore autem ut necessitatibus unde eum dolore similique quo officia voluptas ut nesciunt nihil. Qui exercitationem assumenda est libero odio non quod soluta? Qui neque repudiandae ut amet ullam eos omnis autem a deserunt dicta est praesentium enim rem deleniti asperiores. Hic quas rerum 33 officia fugiat et praesentium alias id unde quisquam sed facere ipsam?

Blockquotes are slightly inset and have a larger left-hand border. The color is set to the text color, which will work with most sites, but there are many ways to have fun and override this style.

This concludes the first section.

What about lists?

Tailwind (a favorite framework of mine), likes to remove all list styles, but I think they should be included by default in text.

Ordered lists are styled the same way.

What about tables?

I went back and forth on whether to style tables, but I figured a general table format was more useful than not, and can be easily changed.

Item Quantity Price
Oranges 5 $5.00
Apples 6 $13.00
Bananas $11 $2.00

Finally

This CSS file is a work in progress, but feel free to use it in your own pages if you like it. Any suggestions are completely welcome! You can reach me at [email protected].