Business or Individual in need of a Twitter Makeover? Custom Twitter Backgrounds
MySpaceLayouts

/* Variable definitions ==================== */ /* Primary layout */ body { margin: 0; padding: 0; border: 0; text-align: center; color: #0066CC; background: #692 url(http://www.blogblog.com/moto_son/outerwrap.gif) top center repeat-y; font-size: small; } img { border: 0; display: block; } .clear { clear: both; } /* Wrapper */ #outer-wrapper { margin: 0 auto; border: 0; width: 692px; text-align: left; background: #FFBBE8 url(http://www.blogblog.com/moto_son/innerwrap.gif) top right repeat-y; font: italic normal 100% Georgia, Times, serif; } /* Header */ #header-wrapper { background: #8b2 url(http://www.blogblog.com/moto_son/headbotborder.gif) bottom left repeat-x; margin: 0 auto; padding-top: 0; padding-right: 0; padding-bottom: 15px; padding-left: 0; border: 0; } #header h1 { text-align: left; font-size: 200%; color: #ffffff; margin: 0; padding-top: 15px; padding-right: 20px; padding-bottom: 0; padding-left: 20px; background-image: url(http://www.blogblog.com/moto_son/topper.gif); background-repeat: repeat-x; background-position: top left; } h1 a, h1 a:link, h1 a:visited { color: #ffffff; } #header .description { font-size: 110%; text-align: left; padding-top: 3px; padding-right: 20px; padding-bottom: 10px; padding-left: 23px; margin: 0; line-height:140%; color: #cc0000; } /* Inner layout */ #content-wrapper { padding: 0 16px; } #main { width: 400px; float: left; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ } #sidebar { width: 226px; float: right; color: #3D81EE; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ } /* Bottom layout */ #footer { clear: left; margin: 0; padding: 0 20px; border: 0; text-align: left; border-top: 1px solid #f9f9f9; } #footer .widget { text-align: left; margin: 0; padding: 10px 0; background-color: transparent; } /* Default links */ a:link, a:visited { font-weight: bold; text-decoration: none; color: #cc0000; background: transparent; } a:hover { font-weight: bold; text-decoration: underline; color: #E895CC; background: transparent; } a:active { font-weight : bold; text-decoration : none; color: #E895CC; background: transparent; } /* Typography */ .main p, .sidebar p, .post-body { line-height: 140%; margin-top: 5px; margin-bottom: 1em; } .post-body blockquote { line-height:1.3em; } h2, h3, h4, h5 { margin: 0; padding: 0; } h2 { font-size: 130%; } h2.date-header { color: #e1771e; } .post h3 { margin-top: 5px; font-size: 120%; } .post-footer { font-style: italic; } .sidebar h2 { color: #0066CC; } .sidebar .widget { margin-top: 12px; margin-right: 0; margin-bottom: 13px; margin-left: 0; padding: 0; } .main .widget { margin-top: 12px; margin-right: 0; margin-bottom: 0; margin-left: 0; } li { line-height: 160%; } .sidebar ul { margin-left: 0; margin-top: 0; padding-left: 0; } .sidebar ul li { list-style: disc url(http://www.blogblog.com/moto_son/diamond.gif) inside; vertical-align: top; padding: 0; margin: 0; } .widget-content { margin-top: 0.5em; } /* Profile ----------------------------------------------- */ .profile-datablock { margin-top: 3px; margin-right: 0; margin-bottom: 5px; margin-left: 0; line-height: 140%; } .profile-textblock { margin-left: 0; } .profile-img { float: left; margin-top: 0; margin-right: 5px; margin-bottom: 5px; margin-left: 0; border:4px solid #8b2; } #comments { border: 0; border-top: 1px dashed #eed; margin-top: 10px; margin-right: 0; margin-bottom: 0; margin-left: 0; padding: 0; } #comments h4 { margin-top: 10px; font-weight: normal; font-style: italic; text-transform: uppercase; letter-spacing: 1px; } #comments dl dt { font-weight: bold; font-style: italic; margin-top: 35px; padding-top: 1px; padding-right: 0; padding-bottom: 0; padding-left: 18px; background: transparent url(http://www.blogblog.com/moto_son/commentbug.gif) top left no-repeat; } #comments dl dd { padding: 0; margin: 0; } .deleted-comment { font-style:italic; color:gray; } .feed-links { clear: both; line-height: 2.5em; } #blog-pager-newer-link { float: left; } #blog-pager-older-link { float: right; } #blog-pager { text-align: center; } /** Page structure tweaks for layout editor wireframe */ body#layout #outer-wrapper { padding-top: 0; } body#layout #header, body#layout #content-wrapper, body#layout #footer { padding: 0; } -->

Tuesday, February 9, 2010

Reflection on IS Lesson 4 - CSS

I am impressed with what CSS can do. It allows different HTML files to use the same style sheet and this will save you a lot of time.

The www.w3schools.com website is very useful. However at times I still cannot really figure out the function of some calls, for eg the relative vs absolute positioning. It took me a while to realise that certain symbols do not appear as you typed when you view with Encoding unicode(UTF), for eg "'" you have to use the HTML ASCII Code.

Initially I realised that the position of my assignment box 4 is different when I run it on Lenovo X61 and Compaq CQ35. Finally I managed to figure out how to centralise position of the box.

I tried the HTML quiz in www.w3schools.com, it helps to reinforce my learning of HTML & CSS. There are so much more that we can learn on HTML & CSS, I look forward to Mr Cheong sharing and teaching us more about HTML and CSS.

I recall the first lesson when I created my blog, I was trying to figue out how I can change the layout, now I am beginning to have some ideas.

Sunday, January 31, 2010

My 3rd IS Lesson Reflection

I was absent from school on Tuesday. Therefore, I went to Mr Cheong's IS website to check out what was taught during his lesson that day. I found out that we had to pair up with a partner to complete the IS worksheet which was handed out that day.

I learnt about html online from a website which Mr Cheong recommanded-http://www.w3schools.com/html/default.asp. It provides detailed explanation of html, and the "Try It Yourself" section allowed me to experiment and view the html code which I had written. It was interesting and I had much fun learning about html and its uses. Though it was difficult in the beginning, it became easier as I got the hang of it after practising.

This assignment has certainly reinforced my understanding of html. I also look forward to my next IS lesson with Mr Cheong.

Wednesday, January 20, 2010

My 2nd IS Lesson Reflection

On my 2nd IS lesson, I learnt the followings:
  • the social impact of new media technologies,
  • ethical issues on media usage and intellectual property
  • the difference between blog and website.

The new media technologies are much more advanced than the old media technologies. There are also newer and better functions and features as compared to before. Web 2.0 has definitely made 2-way communication easier. In Web 1.0, the web master is responsible for constantly updating the website and keep his vistors informed, however with the Web 2.0 it allows interaction among the webmaster and the visitors.

We should also be aware of ethical issues on media usage and intellectual property. Mr Cheong uploaded a video on his website. The video taught us that we should not copy others' materials and not give them credit for what they did as this is considered as plagarism. Plagarism is a serious offence. Even if we do copy the contents of a source, we should not copy more than 10% or 1 chapter of it.

Differences between a blog and a website: A blog is quicker and easier to create as compared to a website. We must often update our blog but we do not have to do that for our website. Thus the information on website is rather static. Blog typically is a simple interface where the author post his ideas and thoughts in a chronological order.

Saturday, January 16, 2010

My 1st IS Lesson Reflection


On my first IS leeson,my teacher,Mr Kent Chong, taught me how to blog.He also assigned us a piece of homework,which is to create a blog.I felt that the lesson was interesting and helpful.It was also quite fun.