How to: Navigational Table of Contents by imnotsana, literature
Literature
How to: Navigational Table of Contents
Hey all!
With all these lengthy articles and tutorials flying around these days, I thought it'd be useful for those writers to know how to easily make a navigational Table of Contents at the top of the article where you can just click on the link that will automatically jump to that certain section within your page. And then go back up to the Table of Contents and easily browse through the page. All it uses is a bit of HTML, no CSS. Below is a working sample of what I'm going to explain:
Name of Topic
Table of Contents
1. Introduction
2. Body
3. Conclusion
1. Introduction
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque fr
Lists are awesome :meow: So let's talk about them :D
The basic list format is avaiable everywhere on dA, you do not need a premium membership to create a list. Of course you could just use :bulletgreen: or a symbol like ~ to indicate a new list item, but an actual HTML coded list has a lot of benefits over that.
Especially when you have single points that exceed a single line a HTML list, a line break appears at a spot you cannot control and therefore you will end up having no indentation and it will just look messy.
You don't have to be a Premium Member to use the HTML for lists, see FAQ #104: https://www.deviantart.com/help/104 - What HTML formatting can we use on DeviantArt? And what is the format for these codes?
You do need it, if you want to use Journal Skin
A CSS rule in its most basic form is made up of two components: a selector and a declaration.
.example { color: #000; }
As the term suggests, a selector is utilized to target (select) a certain element or certain elements and enable you to style them. On deviantART, you'll find that the selector mostly in use is class, which is depicted as a dot, prominently used in tandem with the HTML tags <div> and <span>.
Following the selector comes a curly bracket. The curly brackets contain the actual style information, in other words: the declarations. In the above example, the declaration is:
color: #000
A declaration consists of two p
CSS Tricks: Fonts and Text Basics by pica-ae, literature
Literature
CSS Tricks: Fonts and Text Basics
Today I want to talk about fonts in journal skins :XD: You probably saw this one coming :giggle: And maybe you also saw coming that this will be a rather long tutorial :faint: There is just a lot to say about this! Actually this will only be the first one about fonts and text. This one will cover the basics of working with fonts.
I will start by talking a bit about web-safe fonts and the concept behind a fallback hierarchy. Further down you'll find a selection of properties that can be styled with examples and explanations.
So, let's go! :eager:
The standard web safe fonts
A font is defined as web safe when it is installen on a great numbe
CSS Tricks: Before and After! by pica-ae, literature
Literature
CSS Tricks: Before and After!
No, this is not about a tv show in which I take a CSS and make it prettier ;)
It is about the pseudo-elements ::before and ::after.
They are similiar for example to the :hover element, meaning that it is not necessary (or possible) to add them to the HTML, but can be controlled purely by writing CSS. They are always there, but whether they are visible depends on whether you code them or not.
::before and ::after are almost self-explanatory pseudo-elements. They define what happens either before or after a regular HTML element. They can be applied to any element.
Let's get right going!
So in the first simple example we are going to add gui
PE: A Guide to Gallery CSS by SimplySilent, journal
PE: A Guide to Gallery CSS
A Guide to Gallery CSS
Learn the basics of Gallery CSS with this easy-to-follow guide! :dummy:
In this tutorial, we'll cover:
Adding gallery CSSCoding gallery skinsSome useful resources
Adding Gallery CSS
First of all, some important facts about Gallery Skins:
Only Premium Members are allowed to add CSS to their galleriesSkins can be added to both the Gallery and the FavoritesSkins can only be added to the Gallery folders and Favorites collections (shown in the sidebar) but not the main page itself
Step 1: Click on one of your Gallery or Favorites folders in the sidebar.
Step 2: Click the button called "Folder Options" or "Collection Op