Are you the CSS to my HTML?

eeeehm, so what?

After reading the statement “You are the CSS to my HTML” on a t-shirt  I was not able to understand it. This lack of knowledge made me feel stupid and uncomfortable. On the one hand side this might be the problem of missing technical know-how but on the other hand it is definitely my fear of technology. Till now I didn’t want to gain more information concerning this topic because I was scared of not understanding it. BUT I figured out that this is really not a big deal.

In my today’s post I want to overcome this fear and want to say “Bye, bye fear of technology!” and “Hello pleasure working with it!”

I’m going to explain CSS, its characteristics and features and the reasons of style sheets.

Cascading Style Sheets (CSS) is a style sheet language used to describe the look and formatting of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML.

Ok. Now my understanding and translation: CSS is a language that is used to create your personlised homepage. You can ‘beautify’ your homepage with different fonts, colours, wallpapers etc.

Sounds cool, right?

So, stylesheets are the direct complement to HTML.  It is a language for defining attributes of HTML elements. Using stylesheets  you can determine, for example, that for headings of 1st order a large font size has to be provided, in the font Arial, but not fat and that these headings should appear at a distance of 1.5 cm to the next paragraph.  These statements are not possible with HTML alone.

But this is not all- stylesheets are also able to provide different background colours, wallpapers and various frames for paragraphs, lists or forms . With CSS you can position elements in the display window of the web browser and define distances.

In general, stylesheets support the professional design of web design  and they assist with corporate design for large projects or for company-specific layouts.

They consist of formats that you define for certain HTML elements or for a certain set of HTML elements. CSS styles can be defined either in a central area of ​​style, in an external CSS file or directly in the opening tag of an HTML element. They also consist of one or more features and value assignments to these features.

This image illustrates in a very understandable way (also for technic-scared people like me!) what style sheets are good for. As you can see is the appearance of the content, that is linked to the HTML document, depending on a CSS file- so that the user is able to discover a well-designed web site.

For those who want to leran more on how to use this language: this tutorial will help you!

So all in all, I can confirm what I’ve said at the beginning: It is nota big deal. You’ll always find forums/ web sites/ videos etc. that are explaning the most difficult things in an understandable way.

And now I do understand the statement “You are the CSS to my HTML” . Ha, romantic… :)

Advertisements

About Lisa

20-years-old blogging newbe, living in fantastic Berlin and studying International Business Management. View all posts by Lisa

7 responses to “Are you the CSS to my HTML?

  • itjessica

    Hi Lisa!

    Great Article! I especially like your introduction into the topic and how you come back to it in the end. Me too, I never actually thought about CSS and what it is, so I probably felt as dumb as you when I saw the picture on the right. It definitely is an interesting topic and you explained it really well. One can see, that you tried hard to get into the topic and make it understandable for others. I like the way how you translated the definition at the beginning with your own words into something even a “Normalo” can understand. Also the rest of your post is written very clear and understandable but without appearing too informal. The graphic in the end underlines well what you said before and can be seen as some kind of conclusion. Well done!

  • maxsc21

    Lisa, thanks a lot for explaining that joke.. i was exactly in the same situation when Dr.B showed the picture of that shirt in his presentation. I hate that feeling when someone tells something which is supposed to be funny and i can’t understand it.
    Till today, i had an idea what HTML is, but never heard a lot about CSS. Now i realized that both go together like pie and ice cream and can understand the humor of the slogan ;) other thing: i also like your style of writing and how you structured your article. well done!

  • angiethiem

    Lizzleley!Cooool!
    You got me. Like Max already mentioned I felt so stupid when Dr. B showed the slide with the shirt. Funny funny, smile and hope nobody will notice. ooops. Unlike you I had another strategy: forget und act like it never happened. Cool that u showed more strenght and were honest to youself! It’s good that u take time for those little questions in life. And also good: you write a blogpost about it and help us fools!
    Thank youuuuu! ;)

  • Nadja K.

    Hey Lisa,
    I was more than interested in reading you article since I tried to discover all the secrets of CSS in the “Say bye bye to my fear of technology” post myself. I was also quite surprised about the relation between HTML and CSS and how closely it actually was connected. I really like how you included a graph into your post to emphasize the relation between them both and the end-user. So did you try to work with CSS a little bit? I had a few experiments on WordPress but got even funnier results in return :) I soon figured out that CSS (of course) would vary between different markup languages.

    Besides, the extremely entertaining T-shirt you published was leading me to this webpage offering anyone to post something funny about “CSS is like…” (always interesting to see what people have as interests ;) You may also want to take a look!

    http://css-tricks.com/2541-css-is-like/

    And so I say “CSS is like chess. You can learn the basics in a day and spend a lifetime mastering it.” Cheers!

  • lisabu00

    Hey Lisa,
    what a nice post you wrote. It was really fun to read and eay to follow for those – like me – who have no idea what this f****** shirt is about. So thank you for your explaination.
    I just can agree with max – i hate it not to be able to laugh because i don’t get a joke. at least it will never happen again with this one. ;)

    I just would recommend to expand your post with some examples to emphasize the effect and to visualize what you wrote.

    but in the end – very very well done! :)

  • moonjungkoo

    Hi Lisa, it is really shame on me that I just read your post today, if I read it before, I would have much more interested in CSS and HTML.

    I think you got a talent in expaining difficult jargons for computers like a story-telling. I was attracted to your post as I also could not comprehend the text on the T-shirt, but, at the end of your post, I became fascinated in CSS and totally love the video you tagged on here. Funnily enough, the demonstrator of CSS on the video introduced herself as Lisa so I thought you created the video in the beginning ;)

    I think once my exams are over, I will definitely come back to your post and learn more about it, thanks a lot for this informative post!! It was well thought out and made my fears of computer related jargons go away, too!!

    Moon

  • natiliab

    Hi Lisa,

    Your opening sentence is great! You really hooked me and you continued in a funny and understandable way in your introduction. Before reading your post I was also not able to understand the statement on the T-Shirt. But you clearly explained what CSS means and its connection to html. I am glad that I now know what the relationship between the two is and how CSS actually works.
    I think that most things concerning programming language, software etc. seem difficult and scary to many people because one knows so little about the whole picture. But taking apart small elements of the whole World Wide Web helps to understand it. Before actively dealing with technology in our course I was fearful but seeing that every one of us is able to explain topics with their own words shows me that I am not fearful anymore. Like you said in your conclusion you can always find help on the web so there is no reason to be scary or fearful.

    This is a link that shows you how to optimize your CSS so that the loading of websites become faster: http://www.smashingeeks.com/18779/featured/6-online-tools-to-customize-your-cascading-style-sheets

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: