So recently I've had people ask me how do certain things on presentations, so I'm gonna try my best to explain it here. Remember that you can use the "Basic HTML Editor" and find more code in the "HTML code" section above.
<p style="background: linear-gradient(180deg, #ffffe0 1%, #FFD1CC 43%, #A9D7CA 100%) transparent; width:500px; height: 500px; margin:auto; text-align:center;color:#B6B6B6; font-size: 15px;"><span style="font-size:15px;">I hope this helps</span></p>
Okay, so the red is the angle of the gradient background.
The orange is the colour code.
The green is the percentage of how much you see of that colour (and blending).
The blue is important stuff for making the background gradient.
The indigo is the width and height (stardoll presentations can go to a maximum of 540px width I believe)
The purple centers your presentation and text - you can also use left or right.
And the rest is basic stuff you should already know.
style="background-color:#DEDEDE; width:500px; margin:auto;
text-align:center;color:#B6B6B6; font-size: 15px;" title="©
<span style="font-size:36px;">Title</span> <span style="background-color:#FFFFFF;margin-left: 20px; color: #000000; float: left; font-family: 'Trebuchet MS',Arial; font-size: 12px; margin-top: 15px; padding: 0px; text-align:center; width: 460px;height: 100px; overflow-y: scroll;overflow-x: hidden;" title="© Skittle.Fashion">write here your text<br />......</span> </p>
The red is what makes a scroll box.
The orange is needed to make a new section.
The green will make the box move left (or right if you change it to that) or up/down more.
The blue will make the box "float" either left, right or center.
<span style="background-color:white;margin-left: 50px; border:1px
solid black; color: #B560F1; float: left; font-family: Calibri, 'Century
Gothic', 'Trebuchet MS', sans-serif; font-size: 12px; margin-top: 30px;
padding: 0px; text-align:center; width: 400px;height: 250px; overflow:
hidden; opacity: 0.8;" title="© Skittle.Fashion - No Sticky
Paws!"><img alt="" height="250"
is for the image - if you don't know how to do this you simply find an
image you like on Stardoll, right click and go down to "View Images
Info". It should automatically take you to the code you'll need, so just
copy that and paste into that section.
The orange changes the height and width of the image (incase you need to resize)
The green will make the image either more intense or less visible. (you can delete that section though)
The blue changes the outside width and height of the image (like a border)
Other stuff that could be useful:
border-radius: 10px; - makes edges rounded, you can add more. Eg, 10px 15px 50px 40px, which will make each of the corners more rounded.
box-shadow: 4px 3px 5px; OR box-shadow: inset 4px 3px 5px; - this will create a shadow either outside or inset will create a shadow inside your presentation.
" title=" made by...."
- will make a tag, eg. you hover over my presentation and you'll see "©
Skittle.Fashion - No Sticky Paws!". I generally add this part at the
end of my codes.
-moz-transform: rotate(-355deg); - this will rotate your whole presentation or a specific box/area to whatever angle.
Every code must start with "<p style=(rest of code goes here>" and at the very end, ends with "</p>"
Every code after the first one (see above) starts with "<span style=(code goes here)>" and ends with "</span>"
</span> closes the tags (codes) sometime you need multiple </span> at the end of your code.
Shift + Enter (on keyboard) when pressed together will go to the next line without breaking the presentations code. You can also use '<br>' to go to the next line.
" " creates an invisible space this can be useful when needing spaces above titles or at the bottom of a presentation.
If you have any questions, don't be shy to ask.