Shop Forum More Submit  Join Login

Journal {CSS} Guide - Beginners

Sun Jul 14, 2013, 9:18 AM


Hi there,

If you are reading this blog then I assume that you are interested in learning about deviantART Journal Skins. In this beginner’s tutorial I’ll be covering the basic understanding of HTML, CSS and DA’s journal skins. I’ll be explaining everything in details from the scratch so that you do not miss anything. I have designed this tutorial in such a way that I can assure you that you’ll be able to achieve a working knowledge of deviantART journal skins.

A little background about myself: I am a hobby-driven artist who mainly deals with CSS and HTML in deviantART (now). I like to teach people about customization and provide helpful guides to achieve them. I have designed and coded over 100+ skins till now in DA and I can confidently say that I have quite a deep knowledge about dA’s journal and gallery skins.


A point of inspiration (may be):

I never had any kind of formal training or courses on HTML and CSS coding. I have self-learned everything myself only by going through online tutorials that were available in dA and outside dA. So, if I can do it you can do it too! Otherwise, if you say I cannot learn or understand CSS it would only mean that you are not interested to learn about it.


At the end of this tutorial you’ll know:
  1. What is HTML?
  2. What is CSS?
  3. HTML tags and attributes
  4. CSS classes, selectors and properties
  5. How HTML and CSS work together
  6. How CSS and HTML works in DA journal skinning system
  7. How to code your first journal skin


Let's get started!



What is HTML?


HTML is the "mother tongue" of your web browser. HTML is a language, which makes it possible to present information in your browser. Generally, what you see when you view a page on the Internet is your browser's interpretation of HTML. HTML (Hypertext Markup Language) is a standardized system for tagging text files to achieve font, color, graphic, and hyperlink effects on World Wide Web pages.

The general syntax of a HTML page is as follows:

  • <html>
    • <head>
      • <link rel="stylesheet" type="text/css" href="mystyle.css">

      <title>Sample Web page</title>
      </head>

    <body>
    • <p>Here is a paragraph</p>

    </body>
    </html>



Don’t worry you do not actually have to understand the above code. Just see what the syntax is that’s all. I’ll explain at a later point in this tutorial why I have mentioned about the above syntax.





What is CSS?


CSS stands for Cascading Style Sheets. CSS defines HOW HTML elements are to be displayed in a web browser. Using CSS we can define the style of each element of HTML elements. The word “sheets” in CSS comes from the idea where you can create external CSS sheets with a .css format and include them in your page.

The following syntaxes show how CSS is used in any given page:

Syntax 1: External Style Sheets (cannot be used in DA by us)

  • <head>
    • <link rel="stylesheet" type="text/css" href="www.mywebsite.com/pagestyles/mystyle.css">

    </head>


Here the file mystyle.css contains the styles defined.

Example:
  • a {color:red;}
  • p {padding-left:20px;}
  • body {background-image:url("images/back40.gif");}




Syntax 2: Inline Styles (cannot be used in DA by us)

  • <p style="color:red; padding-left:20px;">This is where the content goes for a paragraph.</p>





Syntax 3: Internal Style Sheet (This is the one used in DA by us)

  • <head>
    • <style>
      • a {color:red;}

      • p {padding-left:20px;}

      • body {background-image:url("images/back40.gif");}

      </style>

    </head>



You should just get an idea by now what HTML and CSS are and their syntaxes. Now, let’s get into practical understanding of these.





HTML tags and attributes


HTML tags are keywords (tag names) surrounded by angle brackets like <b>. Normally HTML tags come in pairs like <b> and </b> where <b> denotes the start tag and </b> the end tag.

General syntax of a tag is as follows:

  • <tagname>Content inside it</tagname>




Complete list of available tags can be found here: HTML tags


HTML attributes provide additional information about a tag. Attributes are always specified in the start tag. There can be more than one attribute in a single tag.

General syntax of a tag is as follows:

  • <tagname attribute=”value”>Content inside it</tagname>



List of available attributes can be found here: HTML attributes


Example: Hyperlinks are defined using <a> tag and the URL address of the hyperlink is specified with the help of herf attributes as below.

  • <a href=”http://cyphervisor.deviantart.com”>Hyperlink</a>







CSS classes, selectors and properties


Just like HTML has syntax for writing tags and attributes, CSS also has its own syntax. The syntax of CSS for an element is called as rule.

General syntax of a CSS rule is as follows:

  • selector {declaration;}




A declaration consists of a property and value. And each declaration is written as property:value; So we can re-write the above syntax as below:

  • selector {property:value;}



selector is generally the HTML tag or a class that you want to style.
declaration is one definite style or function of that selector.

Complete list of available properties can be found here: CSS Properties
Different types of selectors can be found here: CSS Selectors


Examples:

  • a {color:red;}
  • p {padding-left:20px;}
  • body {background-image:url("images/back40.gif");}






How HTML and CSS work together


This is the last phase of understanding how HTML and CSS both work together. I’ll be explaining this with live examples.

See the below image and check how the CSS is defined for the tag <h3>



You can now compare and see how the heading <h3> would have looked with and without CSS.

In the above example we have defined two declaration for the selector <h3> One of the declaration color:red; states the colors of the h3 tag as red and the other one padding-left:10px; determines the space to the left of h3 tag as 10 pixels.

Now let’s learn little bit more on how CSS are defined. I am sure you have seen CSS codes which look like something as follows (at least some of them):

a
{
color:red;
}
a:hover
{
color:green;
}
a.drawbox
{
background:white;
}
.gr-body
{
border:2px dotted #fff234;
}
.gr-top h2
{
background:red;
color:white;
}
.title h3
{
background:red;
color:black;
}
.title .shadow
{
background:red;
color:black;
}

/*see no space between .title and .shadow*/

.title.shadow
{
background:red;
color:black;
}


This can be really confusing for a new-comer! It was a hair-pulling situation for me when I first started learning about CSS coding. :giggle: Anyways, I was a noob that time and there was no one to teach me these. But you have got me to save your time! :la:

Alright, lets understand what does those dots(.) before rules (or classes) signifies, when do you "not" use dots(.), what are classes with a dot(.) between them etc. etc. Argggggh! It drives us nuts! I know I know! Now stay calm, relax your mind and I’ll teach the differences between all these dots and no-dots. It is very easy actually. You just need to flow some thumb-rules for this!

NOTE: I am not going to talk about CSS Id here because we can’t use it in deviantART. CSS Ids have hash(#) symbol before them as compared to dot(.) symbol before classes.


So first thing first, let us see which all elements you can style using CSS.

  1. All HTML tags such as <a>, <b>, <h3>, <blockquote>, etc.
  2. Classes (can be used in DA)
  3. Ids (cannot be used in DA)


As said above, we cannot use Ids so I won’t be explaining this to you.


Styling HTML tags
HTML tags are styled using the following syntax:

a {color:red;}

Notice HTML selectors do not need a dot(.) before them. You can never define the style of HTML by putting a dot(.) before it like this

.a {color:red;}  -----> This is incorrect!!!



Styling Classes
Classes are custom selectors that you can define of your own. Example,

.box{background:white; color:black;}

Notice that a class is defined using a dot(.) before them.

NOTE: Starting a classes name with a number (such as .3box or .66mybox) may not work in internet explorer.




Alright! Now have you understood where and why dots(.) are used? Cool! Now let us go into little bit of complex selectors! Take a deep breath.. Lol just kidding. :giggle:

Okay, let us look at the following selectors:

h3 {color:red;}

h3.redborder {border:1px solid red;}

.greenborder {border:1px solid green;}

.spaceleft {margin-left:20px;}

.redborder.box {color:blue; background:white;}

.redborder .box {color:blue; background:white;}



Let us now make sense of all these selectors one-by-one and then we’ll see how do to use them in HTML. :eyes:

h3 {color:red;}
Defines the color of text of <h3> tag as red.

How to use this CSS?:
<h3>Heading</h3>

Result:

Heading




h3.redborder {border:1px solid red;}
Draws a red border around any  <h3> tag  which calls for the .redborder class.

Here we are calling a custom class inside a HTML tag. It can only be use with the  <h3> tag because you have not left any space between the  <h3> tag and  .redborder.

It will not work for other HTML tags.  For example: <u class="redborder">Heading</u> will not get the red text color. It will simply get the default properties as below:
Heading


How to use this CSS?:
<h3 class="redborder">Heading</h3>

Result:

Heading




.greenborder {border:1px solid green;}
Defines a class which will draw a green border around the element wherever used.

How to use this CSS?:
<h3 class="greenborder">Heading</h3>

Result:

Heading



Here we are calling a custom class inside a HTML tag. However, it can be used with any HTML tag or custom designed class.

It will work for other HTML tags or classes.  For example: <u class="greenborder">Heading</u> will get the red text coloras below:
Heading


Explanation:
When you are calling the .greenborder class in the <h3> tag basically it is including the properties of  both <h3> and .greenborder inside it. You can imagine the CSS of the <h3> tag as follows:

h3 {color:red;
border:1px solid green;}


.spaceleft {margin-left:20px;}
Defines a class which will assign a 20px margin to the left of the element wherever used.

How to use this CSS?:
<h3 class="greenborder spaceleft">Heading</h3>

Result:

Heading



Explanation:
When you are calling the .greenborder class plus the .spaceleft class in the <h3> tag basically it is including the properties of  <h3>, .greenborder and .spaceleft inside it. You can imagine the CSS of the <h3> tag as follows:

h3 {color:red;
border:1px solid green;
margin-left:20px;}


.redborder.box {color:blue; background:white;}
Defines the class .redborder which will get a blue text and white background only when the .redborder class is used along with it.

Here if you call only the .box class in a HTML tag it will not work because it is defined to work with it's parent class .redborder


How to use this CSS?:
<div class="redborder box">Heading</div>

Result:
Heading



.redborder .box {color:blue; background:white;}
Defines the class .box which will get a blue text and white background only when it is used anywhere inside the parent .redborder class.


How to use this CSS?:
<div class="redborder"><div class="box">Heading</div> </div>
or
<div class="redborder"><h3>Some text here.</h3><div class="box">Heading</div></div>

Result:
Heading

or

Some text here.

Heading


Explanation:
I'll leave it on you to understand! You should be able to figure it out now! :nod:


Some cool tips and tricks!

1) You can define multiple selectors the same declaration by separating them using commas(,). Example:

h3, .gr-body .text, .list
{
font-size:16px;
}

2) You can define styles for a selected tag or classes that which is present inside another tag or classes using the greater than symbol(>) Example:

h3>span
{
color:green;
}

3) You can insert comments in your CSS by using the /* and */ You can use it anywhere in your CSS to put a small note or description. Comments are written inside the /* and */ as follows:

/*This is demo comment*/




How CSS and HTML works in DA journal skinning system


I have often seen people directly going into the journal entry page or stash writer page and starts typing CSS codes to skin their journals. However, I have found only a few who actually understood how the DA journal skin system works.

I am going to make you understand how the DA journal skin system actually works. Now you'll understand why I have explained all about HTML and CSS all this long! If you have skipped the previous steps then I would suggest to scroll up and just go through it.

Take a look at the DA HTML page below:



In the above image you can see the page contains all sorts of classes for your page widgets, scripts, etc. However, you cannot edit any of the classes or scripts of DA (at least if you are not a hacker or cracker :P) The only part which you can edit is the <div class="negate-box-margin" style=""> and all the selectors inside it. Making sense now? If you are still unclear, then let me tell you....this is the part you get to edit in your journal editor or stash writer! Duh!

Now check out the expanded class of <div class="negate-box-margin" style=""> below and see all the selectors that are present inside it. If you ever had tried to edit a skin then you'll be able to relate the things here on.



Lets make the picture more clear shall we? Let's observe a practical example now. Check out the below image of the journal editor. You can see we write codes something like this:



So now, if you see the CSS code above you see that we are editing the selectors (more precisely the classes) .gr-box, .gr-top and .gr-body from the above  <div class="gr-box gr-genericbox" usr="">,  <div class="gr-top" usr=""> and <div class="gr-body" usr="">

This is how skins are made in deviantART! (By editing the pre-defined classes of dA and sometimes including your own classes)






How to code your first journal skin


Now, since you understood how to go about editing the selectors (or classes) of deviantART lets go ahead and create a very basic skin.

Below is the skin that we will create:



Let's start!

Open your new journal entry page and paste the Lorem Ipsum in the journal text area and click on "Edit Skin".

New deviantART journal window Tip:

Select HTML mode to insert your text and HTML tags. Otherwise if you insert your HTML tags in the Rich text mode you may get undesirable results.




After you have clicked on "Edit Skin" enter the following CSS code in the CSS area and then enter you desired skin name and save the skin. Don't worry! I'll explain what you have just entered.


.gr-box *
{
background:transparent;
border:0;
margin:0;
padding:0;
}
.gr-top h2 img, .gr1, .gr2, .gr3, .tri, .gr3.gb, .gr2.gb, .gr1.gb
{
display:none;
}
.gr-box
{
background:#efffc0;
border-radius:5px;
border:1px solid #aacd41;
}
.gr-top
{
background:#fdffec;
border-bottom:1px solid #aacd41;
height:50px;
padding-top:10px;
}
.gr-top .gr
{
margin-left:-10px;
}
.gr-top h2, .gr-top h2 a
{
color:#ff589f;
font-family:Times new roman;
font-size:24px;
}
.gr-top span
{
color:#9f9f9f;
}
.gr-body .text
{
padding-top:20px;
padding-left:20px;
padding-right:20px;
}
.gr-body .list
{
background:#fdffec;
border-top:1px solid #aacd41;
padding:10px;
}
.gr-body .list .f.a
{
background:#fdffec;
}


What have you just entered?

DA's journal skin is divided into two main parts: .gr-top and .gr-body and there are .gr1, .gr2, .gr3, etc. which mainly controls the shine effect in corners of the new default skin of DA.

Step 1: Reset the skin

As you have understood from the above, deviantART has a default skin for your journal. So, in order to create a new skin we need to reset every element of the skin. The best way to do that is by using the star (*) selector. The star (*) selector basically applies the CSS to all it's child selectors (or classes). Hence, I have reset the background, border, margin and padding of the whole journal to "nothing" by applying it to the .gr-box *

.gr-box *
{
background:transparent;
border:0;
margin:0;
padding:0;
}

Step 2: Apply style the skin

This step is actually the "creative side" and "technical understanding" of your skin. This is the step which differentiates one skin from the other. You can do infinite number of things here. However, for our understanding I'll be just sticking to the above codes so that you understand the basics and then experiment it yourself.

An expert's tip:

The best way to learn CSS is by experimenting with the elements that you are styling. Try to learn new things from other skins/tutorials and check how elements are manipulated. Learn new properties and attibutes and apply your understanding.


We have removed certain classes from our skin by the following rule. In the below rule you can see that I have assigned the declaration display:none; to all the selectors by separating them with commas.

.gr-top h2 img, .gr1, .gr2, .gr3, .tri, .gr3.gb, .gr2.gb, .gr1.gb
{
display:none;
}


For our demo skin we have done the following in the .gr-box

.gr-box
{
background:#efffc0;
border-radius:5px;
border:1px solid #aacd41;
}


Here we have created a declaration to change the background color by using background:#efffc0; and then we made the corners rounded by using border-radius:5px; and applied a border of 1px width and of solid color using border:1px solid #aacd41;

In the .gr-top selector we have changed the background and gave it a border at the bottom and set the height to fixed 50px. The padding-top was used to push down the content inside it.

.gr-top
{
background:#fdffec;
border-bottom:1px solid #aacd41;
height:50px;
padding-top:10px;
}


We have also edited some of the child classes of .gr-top namely .gr, h2(the journal title), h2 a(the hyperlink of journal title) and span (the date) by changing the font-size, font-family and colors.

.gr-top .gr
{
margin-left:-10px;
}
.gr-top h2, .gr-top h2 a
{
color:#ff589f;
font-family:Times new roman;
font-size:24px;
}
.gr-top span
{
color:#9f9f9f;
}


Finally we have edited some of the child classes of .gr-body namely .text(the journal text area) and .list(the moods area) by changing the border style and color, padding and background colors.

.gr-body .text
{
padding-top:20px;
padding-left:20px;
padding-right:20px;
}
.gr-body .list
{
background:#fdffec;
border-top:1px solid #aacd41;
padding:10px;
}
.gr-body .list .f.a
{
background:#fdffec;
}


Hope you enjoyed this tutorial!


I am a free customization resource provider for the deviantART community. If you like my free customization resources you can donate some points :points: to me as an appreciation or support.

I take commissions to make custom journal/gallery CSS too. Check out my CSS Skins folder. Send me a note to contact me.






Skin copyright CypherVisor
Add a Comment:
 
:iconrachelnoel-designs:
RachelNoel-Designs Featured By Owner Oct 13, 2018  Professional Digital Artist
Your are a big inspiration!
Thank you for making this tutorial.
Also, your profile layout is amazing!!
:happybounce: 
Reply
:iconskywiz:
Skywiz Featured By Owner May 1, 2018  Student Digital Artist
Thank you for this, with your help, I was able to succeed in making a skin for a group project I was making. (if you'd like to take a look, it's here: Wyngro: A Class of Your Own - Week 1 )
Reply
:iconnikki-boom:
nikki-boom Featured By Owner Mar 11, 2018  Hobbyist Interface Designer
im such a newb, i have a journal skin, but i want my friends widget embedded onto it, how do i do that
Reply
:iconkolewazaki-san:
Kolewazaki-san Featured By Owner Feb 27, 2018  Professional Digital Artist
This is awesome and pretty much the most helpful explanation that I have found so far! Thanks! Big Grin 
Reply
:iconcuberman3141:
Cuberman3141 Featured By Owner Feb 24, 2018  Student Digital Artist
The people who understand this already know this
And people who don't know this don't understand this
So
Meep
Reply
:iconyunniethememe:
yunniethememe Featured By Owner Feb 20, 2018  Student General Artist
AA I NEED CORE :/
Reply
:iconcamillachan02:
CamillaChan02 Featured By Owner Edited Mar 27, 2018  Student Digital Artist
Reply
:iconaiphawolf222:
AIphaWolf222 Featured By Owner Jan 13, 2018  Hobbyist Digital Artist
me: WHAT THE FUCK AM I READING
Reply
:iconcamillachan02:
CamillaChan02 Featured By Owner Mar 27, 2018  Student Digital Artist
Reply
:iconkoisushii:
KoiSushii Featured By Owner Nov 8, 2017  Hobbyist Digital Artist
is there a way I can set a certain image to become my background? ( sorry if you did cover it ) thanks a bunch!
Reply
:icondr---pepper:
Dr---Pepper Featured By Owner Edited Aug 27, 2017  Hobbyist General Artist
I still don't understand a few things, but for the most part, I understand. I've been playing around with it and I made my first journal skin, which turned out to be a disaster. Now I made a simple black and white Dr Pepper skin with rounded corners! Yay!
Reply
:iconcamillachan02:
CamillaChan02 Featured By Owner Mar 27, 2018  Student Digital Artist
Reply
:iconviviannaarts:
ViviannaArts Featured By Owner Aug 19, 2017  Student Traditional Artist
Umm 😐 i need help understanding still
Reply
:iconlinjason920523:
linjason920523 Featured By Owner Jul 6, 2017  Student Digital Artist
just the core user able to do it. :P :(
Reply
:iconcamillachan02:
CamillaChan02 Featured By Owner Mar 27, 2018  Student Digital Artist
Reply
:iconyunniethememe:
yunniethememe Featured By Owner Feb 20, 2018  Student General Artist
yea
Reply
:iconprincessfireshinee:
PrincessFireShinee Featured By Owner May 15, 2017  Hobbyist Digital Artist
I still don't understand
Reply
:iconfoxiemctails:
foxiemctails Featured By Owner Mar 12, 2017
this is still really fucking confusing XD
Reply
:iconehxkor:
EHXKOR Featured By Owner Mar 25, 2017  Student General Artist
I found it super confusing until I started actually taking a course in it in college. For more help, I highly suggest going to The New Code. This website is created by my instructor which he updates on a regular basis and is an excellent resource.
Reply
:iconfoxiemctails:
foxiemctails Featured By Owner Mar 25, 2017
sweet thank you :)
Reply
:iconehxkor:
EHXKOR Featured By Owner Edited Mar 25, 2017  Student General Artist
You're very welcome, glad I could help! However I must let you know, this blog contains mostly HTML5 techniques with HTML, CSS, Javascript, and other coding languages as this is the current version while deviantart still uses XHTML. 
Reply
:iconfoxiemctails:
foxiemctails Featured By Owner Mar 25, 2017
i know a bit of coding language. and if i don't know something i can always look it up! thanks again :)
Reply
:iconehxkor:
EHXKOR Featured By Owner Mar 27, 2017  Student General Artist
That's the spirit! You're very welcome!
Reply
:iconollie487testing:
ollie487testing Featured By Owner Jan 3, 2017
I've come back to this after going off and reading about CSS, so it makes a little more sense to me now.
What I'd like to know (if possible) is what all those various default classes refer to on the journal page, because after .gr-top, .gr-body, .gr-text... things are not so obvious and I wouldn't know what I was changing.
Brilliant article btw.
Reply
:iconmoonbeamzz:
MoonBeamzz Featured By Owner Dec 30, 2016  Hobbyist Artist
Still don't understand DX
Reply
:iconp-a-s-t-e-i:
p-a-s-t-e-I Featured By Owner Dec 30, 2016  Hobbyist Digital Artist
i have

no idea

what this is trying to explain to me
Reply
:iconenderkiller1987:
Enderkiller1987 Featured By Owner Dec 11, 2016  Hobbyist Digital Artist
i don't understand anything XD
Reply
:iconclaranekochan:
ClaraNekoChan Featured By Owner Dec 28, 2017  Student Artist
same
Reply
:iconstella-draws:
Stella-Draws Featured By Owner Nov 7, 2016  Student General Artist
Gosh. I was lost when they asked me to edit my skin. Thanks a million for the tutorial. =D Could we copy and paste the desired syntax as well? If so, or not, I'm ready... =D
Reply
:iconthystyn:
Thystyn Featured By Owner Aug 25, 2016  Hobbyist General Artist
Thanks for such a detailed tutorial.  One day when I get Core, I will have a serious go at using it.
Reply
:iconmiaenchantedfairy:
MiaEnchantedFairy Featured By Owner Jul 14, 2016  Student Artisan Crafter
Just ask, how can I use my own drawing in jourskin/make the folder ?
Reply
:iconstitch2cute:
Stitch2Cute Featured By Owner Jun 28, 2016  Hobbyist Digital Artist
OML this is so confusing at the same time helpful ;-; But anyways thanks for the tutorial!
Reply
:iconozzuubear:
ozzuubear Featured By Owner Edited Jun 3, 2016  Hobbyist Digital Artist
super useful!! thanks!! but I somehow cant remove the pink box in the title header: prntscr.com/bbtknm
anybody that can help?
fixed!!
Reply
:iconcynderthedragon5768:
Cynderthedragon5768 Featured By Owner May 10, 2016  Hobbyist Digital Artist
I can't seem to copy the code for the journal
Reply
:icondreamieramune:
DreamieRamune Featured By Owner Mar 22, 2016
Too complicated! :angry: 
Reply
:iconcatrionaleo:
CatrionaLeo Featured By Owner Mar 15, 2016   General Artist
Thank you for putting this up in had a college professor who could not explain this well at all
Reply
:iconarzika:
arzika Featured By Owner Jan 22, 2016  Hobbyist Digital Artist
hey
Some reason everytime I click "edit skin" the options won't show up and I can't delete one of Maygebee journal skins :( (Sad)

Reply
:iconorigin-artsandcomics:
Origin-ArtsandComics Featured By Owner Jan 16, 2016  Hobbyist Digital Artist
I should have stayed in school @_@
Reply
:iconnaruko6783:
naruko6783 Featured By Owner Jan 17, 2016  Professional Artist
lol XD
Reply
:iconnaitomeiya:
NaitomeIya Featured By Owner Jan 5, 2016  Hobbyist Digital Artist
I was able to survive the html basics in Computer class back in highschool.
I should be able to learn this no sweat! /o/

The instructions are very easy to understand. Very useful tutorial.
Deserves a spot in daily deviations, this journal. Od //shot
Reply
:iconmorganacannon:
morganacannon Featured By Owner Jan 28, 2016  Professional General Artist
You wouldn't believe how jealous anyone older than you is that you had html basics in computer class in highschool. I'm teaching myself html from scratch at 24 and my day-job working brain is so slow. 
Reply
:iconelkfries:
Elkfries Featured By Owner Nov 29, 2016  Student Digital Artist
if youre teaching yourself html and css I highly reccomend khan academy for that.
They really explain things and give you a chance to work it out yourself! Plus its free. vuv
Reply
:iconnaitomeiya:
NaitomeIya Featured By Owner Jan 30, 2016  Hobbyist Digital Artist
:iconlazycryplz: The html basics we tackled at highschool were already tackled by freakin' deviantART itself. Like the bold tag or the strike tag or the hr divider thingy and the p tag crap. We were taught only how to format and arrange text, nothing else. O)-<
Reply
:iconmorganacannon:
morganacannon Featured By Owner Feb 7, 2016  Professional General Artist
<3 School tries. but god it fails at keeping up with current technology and completely underestimates the potential of students who are goshdarn bored with their methods but would strive and bust to learn things like html given the chance, I've heard stories of self-learned kids who use a combination of school resources supplied for homeschooling and the internet to bust their potential abilities wide open and soar way in front of normal school kids academically. Education needs to change and I actually believe maybe a few years in front of us there are academics and forward thinking individuals already trying.
Reply
:iconinfograflow04:
Infograflow04 Featured By Owner Dec 14, 2015  Hobbyist Digital Artist
Hello. I'm into HTML and CSS designs, and I was happy to discover that feature. One point you may have forgotten to mention is that in order to save your journal skin you have to be core member, else you're stuck pretty much...
Reply
:iconthe-shiny-eevee:
The-Shiny-Eevee Featured By Owner Dec 6, 2015  Hobbyist Digital Artist
If I do the art would somebody help me with the coding XD ?
Reply
:iconsunnychest:
SunnyChest Featured By Owner Nov 26, 2015  Student Digital Artist
Hi! Sweet tutorial, I just woud like to know how could I put a header image on the top of it.
Reply
:iconinfograflow04:
Infograflow04 Featured By Owner Dec 14, 2015  Hobbyist Digital Artist
When you modify your journal entry just switch to HTML mode and add a simple <img src="laction of your pic"/> tag wherever you want to add your picture
Reply
:iconsunnychest:
SunnyChest Featured By Owner Dec 16, 2015  Student Digital Artist
Thank you! :la:
Reply
Add a Comment:
 
×

Featured in Collections

Babbling Blogs by nimbusphoenix

JorunalorContests by MusicalCombusken

Journal Entries, Contests by spazzerilla


More from DeviantArt



Details

Submitted on
July 14, 2013
Link
Thumb

Stats

Views
75,060 (1 today)
Favourites
1,983 (who?)
Comments
523