Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Tips, Tricks, and Code Snippets - A Profile Beautifying thread
#1
As you probably know, in-game profiles accept HTML and CSS style sheets. The unfortunate thing, however, is that a lot of us aren't very... versed in such things.

That's where this thread comes in - It's here for everyone to share their tips, tricks, and code if they're so inclined.

I, personally, use this website for previewing my HTML, and this website for various symbols that can be used in text. Unfortunately, a lot of alt codes have been phased out for emoji, and I have no clue if they'll work as symbols or not.
Reply
#2
(05-30-2021, 04:26 PM)chimeranyx Wrote: As you probably know, in-game profiles accept HTML and CSS style sheets. The unfortunate thing, however, is that a lot of us aren't very... versed in such things.

That's where this thread comes in - It's here for everyone to share their tips, tricks, and code if they're so inclined.

I, personally, use this website for previewing my HTML, and this website for various symbols that can be used in text. Unfortunately, a lot of alt codes have been phased out for emoji, and I have no clue if they'll work as symbols or not.


BYOND only supports a handful of attributes in maptext when it comes to CSS.

The current usable attributes are:
color 
background
font-size
font-style
font-weight
font-family
font
text-decoration
text-align 
vertical-align
text-indent
margin-left
margin-right
width
height
line-height

text-shadow


As for how to handle a style sheet.

Style Sheets allow you to predefine elements (the <b> tag for example) for everything in a document and generally allow you to make your HTML more uniform and easier to modify/change, while having additional features not in standard hypertext markup documents; you can precisely define sizes and list alternatives for fonts with style, although the latter doesn't work too well on BYOND from quick tests.

An example style sheet would be.

Code:
css

#ID{font:bold 11pt 'BlackChancery' color:#F00;}
.class{font:italic bold 15pt 'Calibri' color:#00F;}
b{color:#0F0;}

html

<div id=ID>This is bold and red.</div>
<div class=class>This is italic, bolt and blue.</div>
<b>This is green and bold.</b>

As you can see here, an element denoted by a # would be an ID, while an element denoted by a . is a class and you can modify preexisting HTML attributes with a style sheet.

An ID is generally meant to be unique/for a singular part of the document but there's no consequence for listing everything as an ID, it also saves text-space if you care about ASCII artwork.


This is also an incredibly handy resource if you're curious about what each of the attributes do specifically.
https://www.w3schools.com/cssref/
[-] The following 2 users Like Miller's post:
  • chimeranyx, K Peculier
Reply


Forum Jump:


Users browsing this thread: 1 Guest(s)
Sigrogana Legend 2 Discord