HTML
This tag belongs to the Additional Tags Category.
Parent tags (more general):
This tag has not been marked common and can't be filtered on (yet).
Works which have used it as a tag:
Pages Navigation
-
Tags
Summary
You are granted the rare chance to communicate with an Unknown Deity, but the word limit stands between you and the answers you seek.
Every choice you make and every question you ask alters the path you take. What will you uncover about the Deity and the world around you? As the final word approaches will you discover what you truly desire or will you be left with more questions than answers?
Series
- Part 5 of Beyond the Limit
-
mm whatcha say?: Changing Text On Hover for Multilingual Fics (A Download Friendly Workskin) by mackerel_cheese for Graverobbber, enbyguous, vespeelira
Fandoms: No Fandom
18 Mar 2025
Tags
Summary
Do you want to have a nifty way to have multiple languages in a fic:
- Without making your readers scroll to the AN for a translation?
- Without the text and translation sitting side by side?
- And still make it look pretty when people download it into an EPUB or PDF format?
Here is a solution for you. Come on babygirls, let's roll.
(This is a HTML tutorial but I'm lowkey flirting with you by calling you babygirl occasionally because I got bored while writing this.)
Series
- Part 3 of .shapes_and_colours
-
Toggle for all caps, all lowercase, and capitalization by DoctorDizzyspinner
Fandoms: No Fandom, Ao3 meta - Fandom
22 Mar 2025
Tags
Summary
It's not a good idea to write in all caps or all lowercase. See: Use CSS Text Transform for Better Accessibility and text-transform - CSS: Cascading Style Sheets | MDN.
This provides free to use CSS for both
text-transformand a toggle for turning these styles on and off so that the reader does not have to turn off the entire workskin if they do not want to see all caps or all lowercase words.Series
- Part 3 of My Code Snippets
-
Tags
-
Episode One: Dig, dig, dig, little animal. by Sophiebybophie
Fandoms: Batman - All Media Types
21 Mar 2025
Tags
Summary
He is born loved, dies loved, and is brought back loved.
—
Aka. Jason Todd is Life and Death’s Cat. He doesn’t know it.
(Mature because I like to describe violence lol)Series
-
Tags
Summary
A drabble that is 100
words.Series
- Part 1 of Beyond the Limit
-
Tags
Summary
Some very simple CSS and HTML for a very simple twitter trending page.
-
Tags
Summary
A drabble that is nothing
until there is.Series
- Part 3 of Beyond the Limit
-
Inside, Outside, Upside-down by Charles_Rockafellor
Fandoms: AO3 CSS, css - Fandom, HTML - Fandom
24 Mar 2025
Tags
Summary
I threw this together overnight (and have tweaked it some since then). Just applying a few little CSS party tricks that I've learned or developed along the way... 😉
My tricks aren't revealed in the narration, but since this is a How To series, you should be able to ferret them out by now — and if not, then take it as your homework challenge! ❤️
Use your 1337 haX0r Wiz zen skillz.
Click for keynote
Best viewed on a COMPUTER browser with a MOUSE, not a 'phone where some effects will be missed or simply not optimized (though there are a couple of surprises that appear on iPhone [not Android] rather than desktop browsers).
⚠️
CAUTION, beware of audio from invisible video; see notes.
⚠️Cf. notes in work skin for issues w.r.t. different approaches used in this work.
Series
- Part 4 of How to
-
Tags
Summary
A
choiceof what lies beyond 100 words.Series
- Part 4 of Beyond the Limit
-
Tags
Summary
Animatic song with words in ao3. Click play to start the audio and animations. Enjoy :]
-
Tags
Summary
"We do this not because it is easy, but because we thought it would be easy"
A completely normal tutorial for making a digital timer on ao3.
-
Tags
Summary
An accessible, screen reader friendly AO3 work skin that imitates the look of in-game Zenless Zone Zero DMs (Knock Knock).
Series
- Part 3 of Pent's Fandom-Specific AO3 Work Skins
-
Tags
-
you were never meant for the computer screen by mackerel_cheese
Fandoms: Harry Potter - J. K. Rowling
31 Mar 2025
Tags
Summary
Viewing Regulus' Internet History
- noah kahan great divide
- noah kahan great divide release date when
- how to stop ssri safely
- sleeping aid alternatives
- melatonin gummies same day delivery
- sirius black twitter
Or: In a world full of sharp edges, some people just need a soft place to land. (Even when they think they don't deserve it.)
Series
- Part 2 of marauders social media html fever dreams
-
Tags
Summary
CSS Credits:
La_Temperanza, Lucifer111, CodenameCarrot, mercuryandglass, JoanielSpeak, TrojanTeapot, anubisisms, MijuWrites
-
How to add emoticon and emoji to your story title, username, chapter title, notes and summary by Goddess_of_the_arena
Fandoms: HTML - Fandom, css - Fandom, Work Skin - Fandom, Work Skins - Fandom, AO3 help - Fandom
03 Apr 2025
Tags
Summary
This guide will give you the codes to add cute emoticon (also in color!) and emoji to your story title, to your username, to the chapter title, to the summary and to the notes.
It contains ready-to-use codes. You can also see right away the effect of every code in the work.
Chapter 2 will explain how to add different emoticon/emoji to every chapter title.
Also, check out heark/hearker's guide here to know how to target the elements of a story (title, username, summary, notes and more)!Series
- Part 8 of CSS GUIDES
-
Government Conspiracies and the Truth About Aliens by sock_stealer
Fandoms: Half-Life (Video Games)
06 Apr 2025
Tags
Summary
There’s a security guard infamous for reading increasingly bizarre conspiracy theorist fiction in Sector C. Gordon hasn’t caught his name yet, but when one of his books is left for the taking, he finds himself growing curious about what kind of individual is working at the top government research center in the nation *and* simultaneously believes the moon landing was faked.
A gayer retelling of the events of Half Life 1, in which Barney and Gordon meet as the world is crashing down around them.
-
Epistolary workskin by irrationalpie for Stratisphyre
Fandoms: No Fandom, 陈情令 | The Untamed (TV)
24 Apr 2025
Tags
Summary
A simple workskin and tutorial for including letters in a fic (with a mini fic to demonstrate!).
This workskin merges with the reader's site skin rather than overriding the text or background color (tested with both default/light mode and reversi/dark mode).
-
Wizarding World Web by alternatime
Fandoms: Dr. STONE (Anime), Dr. STONE (Manga), Harry Potter - J. K. Rowling
13 May 2025
Tags
Summary
Danny: Yo call me crazy but doesn't this guy look like that 7th year that helped take down voldemort? https://www.youtube.com/watch?v=faQ2EVj7SrQ
James: ym Gen??
Anya: you think Gen's the Masked Magician? LMFAOOO
Dave: dude no he's an Asagiri
I heard they're like
Crazy traditionalDr. Stone: Hogwarts au AND social media au (because why not)
Thanks to Senku, wizards have access to the Internet now. What could go wrong?(There's a lot of references to events that happened in the fic No Stone Unturned so be warned)
Series
- Part 2 of Dr. Stone - Hogwarts AU
Pages Navigation
Bookmarks which have used it as a tag:
Pages Navigation
-
Tags
Summary
There are some great quick-and-dirty guides to HTML on A03. This is not one of them - it is a comprehensive guide
It's now 2025, a decade later. A03 supports some new HTML and and we're all walking around reading fic on supercomputers that fit in a jean pocket. It was time update this and take a crack at finishing it. (Links and Images are in, the new Audio and Video tags are not.)
The previous three chapters have been divided into smaller concepts. Each tag continues to have - at a minimum - a link to the w3schools page about it (so you can learn more), a code example, and the result of the code example. Most tags have their attributes, things like [src] or [title], listed and examples of how using the attributes modify the tags.
There's a chapter on Bad Ideas, including how some of the archive's default CSS is available to you to format your work (users can't turn that off by hiding a workskin!)
Oh. And I added a bunny army. You could learn how to add one too.
/)/) /)/) /)/) (..) (..) (..) *( ) *( ) *( )
Series
- Part 19 of AO3 Work Skins/Tutorials
-
Tags
Summary
There are some great quick-and-dirty guides to HTML on A03. This is not one of them - it is a comprehensive guide
It's now 2025, a decade later. A03 supports some new HTML and and we're all walking around reading fic on supercomputers that fit in a jean pocket. It was time update this and take a crack at finishing it. (Links and Images are in, the new Audio and Video tags are not.)
The previous three chapters have been divided into smaller concepts. Each tag continues to have - at a minimum - a link to the w3schools page about it (so you can learn more), a code example, and the result of the code example. Most tags have their attributes, things like [src] or [title], listed and examples of how using the attributes modify the tags.
There's a chapter on Bad Ideas, including how some of the archive's default CSS is available to you to format your work (users can't turn that off by hiding a workskin!)
Oh. And I added a bunny army. You could learn how to add one too.
/)/) /)/) /)/) (..) (..) (..) *( ) *( ) *( )
Series
- Part 19 of AO3 Work Skins/Tutorials
-
Tags
Summary
This is a tutorial/live example on how to make large images fit on mobile browsers but remain normal size on desktop browsers.
Series
- Part 18 of AO3 Work Skins/Tutorials
-
How to Make iOS Text Messages on AO3 by CodenameCarrot, La_Temperanza
Fandoms: No Fandom
10 Apr 2016
Tags
Summary
This is a tutorial/live example on how to mimic iOS text messages on AO3 without the need to use images. There's also a chapter on how to have emojis displayed on AO3 as well.
Series
- Part 3 of AO3 Work Skins/Tutorials
-
Permablocking Specific Tags - Site Skin by Eli0t
Fandoms: Fandom - Fandom, AO3, No Fandom
10 Aug 2023
Tags
Summary
It finally exists. You can block any tag you want forever! You no longer need 3rd party extensions for this!
Series
- Part 1 of AO3 Skins
- Part 1 of :has() selector
-
Tags
Summary
This is a tutorial/live example on how to mimic social media in an AO3 work, specifically Twitter, Reddit, and LiveJournal.
-
AO3 Work Skins/Tutorials by CodenameCarrot, La_Temperanza
Fandom: Deadpool (Comics), Deadpool - All Media Types, No Fandom, Undertale (Video Game)
18 May 2025
- Words:
- 84,915
- Works:
- 19
- Bookmarks:
- 4,029
-
Summary
A series of semi related fics where html is used as a major part of the story telling. experimental story telling, experimental html use, and a lot of reader interactive moments in the stories are present.
- Caffeine Brewed: Used an existing twitter skin to experiment with. A little messy, but it was my first dip into epistolary story telling.
- tired quaranteens: a lot of custom skins made by me. new html gimmicks in almost every chapter. choose your own adventure segment in ch 6 and an interactive segment in ch 7
- do you believe in coincidences?: written in the 2nd person - an interactive game where you explore a mysterious phone and decide who it belongs to, which affects the ending you get. There's more than 1 identity reveal, especially if you get the secret ending 😉 mild references to Caffeine Brewed if you squint.
- the hottest topic: phantom works at hot topic, and the internet suspects he's secretly half ghost, what does that even mean anyway?
- of bugged boxes and blunders: the box ghost learns to think outside the box
- Words:
- 28,692
- Works:
- 5
- Bookmarks:
- 203
Bookmarked by BrightEyedAthene
21 Nov 2022
Bookmarker's Tags:
Bookmarker's Collections:
Bookmarker's Notes
Absolutely phenomenal
-
Tags
Summary
This is a tutorial/live example on how to mimic email windows on AO3 without the need to use images.
Series
- Part 12 of AO3 Work Skins/Tutorials
-
How to Make iOS Text Messages on AO3 by CodenameCarrot, La_Temperanza
Fandoms: No Fandom
10 Apr 2016
Tags
Summary
This is a tutorial/live example on how to mimic iOS text messages on AO3 without the need to use images. There's also a chapter on how to have emojis displayed on AO3 as well.
Series
- Part 3 of AO3 Work Skins/Tutorials
-
Tags
Summary
There are some great quick-and-dirty guides to HTML on A03. This is not one of them - it is a comprehensive guide
It's now 2025, a decade later. A03 supports some new HTML and and we're all walking around reading fic on supercomputers that fit in a jean pocket. It was time update this and take a crack at finishing it. (Links and Images are in, the new Audio and Video tags are not.)
The previous three chapters have been divided into smaller concepts. Each tag continues to have - at a minimum - a link to the w3schools page about it (so you can learn more), a code example, and the result of the code example. Most tags have their attributes, things like [src] or [title], listed and examples of how using the attributes modify the tags.
There's a chapter on Bad Ideas, including how some of the archive's default CSS is available to you to format your work (users can't turn that off by hiding a workskin!)
Oh. And I added a bunny army. You could learn how to add one too.
/)/) /)/) /)/) (..) (..) (..) *( ) *( ) *( )
Series
- Part 19 of AO3 Work Skins/Tutorials
-
Tags
Summary
Just a quick and dirty HTML reference for AO3, with references to CSS style, HTML style, and other guides.
Series
-
How to Make iOS Text Messages on AO3 by CodenameCarrot, La_Temperanza
Fandoms: No Fandom
10 Apr 2016
Tags
Summary
This is a tutorial/live example on how to mimic iOS text messages on AO3 without the need to use images. There's also a chapter on how to have emojis displayed on AO3 as well.
Series
- Part 3 of AO3 Work Skins/Tutorials
-
Tags
Summary
What it says on the tin.
A mock-up of instagram direct messages without having to use screenshots.
-
Tags
Summary
There are some great quick-and-dirty guides to HTML on A03. This is not one of them - it is a comprehensive guide
It's now 2025, a decade later. A03 supports some new HTML and and we're all walking around reading fic on supercomputers that fit in a jean pocket. It was time update this and take a crack at finishing it. (Links and Images are in, the new Audio and Video tags are not.)
The previous three chapters have been divided into smaller concepts. Each tag continues to have - at a minimum - a link to the w3schools page about it (so you can learn more), a code example, and the result of the code example. Most tags have their attributes, things like [src] or [title], listed and examples of how using the attributes modify the tags.
There's a chapter on Bad Ideas, including how some of the archive's default CSS is available to you to format your work (users can't turn that off by hiding a workskin!)
Oh. And I added a bunny army. You could learn how to add one too.
/)/) /)/) /)/) (..) (..) (..) *( ) *( ) *( )
Series
- Part 19 of AO3 Work Skins/Tutorials
-
Tags
Summary
This is a personal experiment with HTML. It is a very limited list with what I find useful.
Update: Somehow I find more and more stuff useful, so this list is not that limited (and not that private) anymore. I'll improve it with time and according to my needs. I just realized, this will never be "complete" and there is no final number of chapters.So far that's posted:
Part One: Basics
Part Two: Lines
Part Three: Footnotes and Links
Part Four: Columns and Skins
Part Five: Pictures
Part Six: Videos (and gifs)
Part Seven: Choose Your Own Adventure
Part Eight: Chapter Title
Part Nine: The Title, the Username, and Links
Part Ten: Boxes (still in progress)
Part Eleven: Newspaper Article
Part Twelve: Content Notes and Spoiler
Part Thirteen: Playground for Jinx (glitch text, color, table)
Part Fourteen: Text generator -
Tags
Summary
Based on phyripo's guide, with some usability improvements made to reblogs and photoset creation.
-
Tags
Summary
Basic HTML codes to create some variety in your AO3 posts.
-
Tags
Summary
just html things that i've learnt/know. chap 1 is pretty easy formatting, chap 2 is slightly more effort. chap 3 is specifically table of contents (links). no css is used here. i hate css.
-
Tags
Summary
Essentially, I write on a mobile device and therefore have to use HTML instead of rich text. I decided to conduct an experiment and these were the results.
If you're having trouble with formatting, this might help...?
[For HTML basics, click "About" on the hotbar up ^ there, then "FAQ" and find your way from there)