Keuntungan dan Kerugian Style Sheets Eksternal

Keuntungan dan Kerugian Style Sheets Eksternal

Menggunakan CSS

Keuntungan dan Kerugian dari Style Sheets EksternalSalah satu hal terbaik tentang Cascading Style Sheets adalah bahwa Anda dapat menggunakannya untuk menjaga situs Anda konsisten. Cara termudah untuk melakukannya adalah untuk menghubungkan atau mengimpor style sheet eksternal. Jika Anda menggunakan style sheet eksternal yang sama untuk setiap halaman situs Anda, Anda dapat yakin bahwa semua halaman akan memiliki gaya yang sama.

Keuntungan Style Sheets Eksternal
1.Anda dapat mengontrol tampilan dan nuansa dari beberapa dokumen sekaligus.
Hal ini sangat berguna jika Anda bekerja dengan tim orang untuk membuat situs Web Anda. Banyak aturan style bisa sulit untuk diingat, dan saat Anda mungkin memilikipanduan gaya dicetak, tidak efisien dan membosankan untuk terus membalik-balik untuk menentukan apakah teks contoh adalah yang akan ditulis di 12 titik font Arial, atau 14kurir titik.
2.Anda bisa membuat kelas gaya yang kemudian dapat digunakan pada banyak elemen HTML yang berbeda.
Jika Anda sering menggunakan font Wingdings khusus untuk memberikan penekanan pada berbagai hal pada halaman Anda, Anda dapat menggunakan kelas WingdingsAnda mengatur dalam style sheet untuk menciptakan mereka, bukan mendefinisikangaya tertentu untuk setiap contoh dari penekanan.
3.Anda dapat dengan mudah mengelompokkan gaya Anda menjadi lebih efisien.
Semua metode pengelompokan yang tersedia untuk CSS dapat digunakan dalam style sheet eksternal, dan ini memberi Anda kontrol dan fleksibilitas pada halaman Anda.

..Kekurangan dari Style Sheets Eksternal:
1.Style sheet eksternal dapat meningkatkan waktu download, jika mereka sangat besar.
2.Jika Anda hanya memiliki sejumlah kecil gaya, mereka dapat meningkatkan kompleksitas dari situs Anda.
3.Seperti dengan render meja, Anda harus menunggu sampai style sheet seluruh dimuat sebelum halaman dapat menampilkan.
4.Style sheet eksternal mendapatkan besar sangat cepat karena sulit untuk mengatakan ketika gaya tidak lagi digunakan, karena itu tidak dihapus saat halaman dihapus.

Tips dan Trik Menggunakan CSS

Percobaan CSS................................

Dapatkan Style Sheets kamu Bekerja Dimanapun Mereka Dilihat


Masalah terbesar dengan menggunakan CSS adalah bahwa hal itu tidak dapat diandalkan atau konsisten di seluruh browser.


Periksa Browser KAMU untuk memperbaiki CSS 
Jika kamu melihat halaman kamu pada Netscape 4.x, dan gaya tidak muncul sama sekali, kamu akan perlu memeriksa preferensi kamu. Bagian frustasi dari ini adalah  jika kamu telah memeriksa "Aktifkan style sheet" (dalam preferensiLanjutan), jika kamu telah menonaktifkan JavaScript Style Sheets juga tidak akan bekerja.



CSS Margin Problems(Masalah Margin pada CSS)


Netscape 4 tidak menangani margin dengan cara yang sama seperti Internet Explorer.Tapi masih mungkin untuk mendapatkan efek yang sama menggunakan tag gaya yang berbeda pada dokumen yang sama. Dan kamu tidak perlu menggunakan JavaScript untuk deteksi browser. Yang perlu  kamu  lakukan adalah menggunakan @ import danCascading untuk keuntungan  kamu .

Sebagai contoh, biasanya, bila kamu menggunakan tag header (h1-h6), ada amoutbesar ruang antara header dan paragraf berikut. Tetapi jika  kamu  menggunakan tag margin untuk memperbaiki ini, kamu akan perlu untuk menulis dua gaya yang berbedauntuk mendapatkannya untuk bekerja dengan benar pada Netscape 4 dan Internet Explorer.


Di Internet Explorer:

h2 {margin-bottom: 0;}
  p {margin-top: 0;}


Dalam Netscape 4
h2 {margin-bottom: 0;}
  p {margin-top:-1em;}


Kemudian, karena Netscape 4 tidak mengakui pernyataan @ import, tetapi mengenali tag <link>,  kamu  dapat menggunakan ini untuk keuntungan  kamu . Pertama menempatkan sifat Netscape dalam file <link>:

<link href="netscape-styles.css" rel="stylesheet" type="text/css">

Kemudian tempat gaya Internet Explorer dalam file @ import (pastikan bahwa itu mengikuti gaya Netscape):

<style type="text/css">
  @ import url (yaitu-styles.css);
  </ style>
Netscape 4 akan hanya membaca style sheet pertama, dan dengan demikian akan membuat teks dengan benar. Internet Explorer akan membaca kedua lembar gaya, tapiakan menggunakan aturan Cascading untuk menentukan yang harus digunakan. Selama gaya impor datang setelah 
terkait gaya, style sheet diimpor akan "menang" dan mereka akan digunakan.

CSS Background Colors


Latar Belakang Warna CSS

Sangat mudah untuk menambahkan warna latar belakang paragraf menggunakan CSS.Paste kode di bawah  ke dalam halaman Web kamu:


<p style="background-color : #cccccc;"> This paragraph should have a grey background color. But if you view it in Netscape, the grey color will only surround the text itself, rather than the entire space of the paragraph, as it does in Internet Explorer. </p>

Jika 
kamu  hanya menambah properti gaya sederhana, Netscape akan memperpanjanglatar belakang ke tepi dari "kotak" yang paragraf. 
kamu  perlu memberitahu Netscapebahwa ada perbatasan, tetapi jika 
kamu
 mengatur properti perbatasan untuk "none", perbatasan tidak akan ditampilkan.






<p style="background-color : #cccccc; border : none;">For example, in this paragraph.</p>



CSS Drop Caps



Cara yang paling logis untuk melakukan drop-tutup akan menggunakan "pertama-huruf"pseudo-elemen. Untuk mengatur drop-tutup menggunakan ini, 
kamu
 mungkin menulisgaya seperti ini. Ketik berikut dan tempatkan dalam elemen <style> </ style> di bagian atas halaman Web Anda:






p.introduction:first-letter {
 font-size : 300%;
 font-weight : bold;
 float : left;
 width : 1em;
 }



Kemudian paste ke dalam tubuh dokumen kamu



<p class="introduction"> This paragraph has the class "introduction". If your browser supports the pseudo-class "first-letter", the first letter will be a drop-cap. </p>

<p class="introduction"> ayat ini memiliki "pengenalan" kelas. Jika browser 
kamu  mendukung pseudo-class "pertama-huruf", huruf pertama akan menjadi drop-tutup. </ p>







Tapi kemungkinan besar, browser kamu tidak mendukung pseudo-kelas. kamu masih bisa berpura-pura di beberapa browser dengan menggunakan tag <span> sekitar huruf pertama dalam paragraf. Sebagai contoh:

<span style="font-size : 200%; font-weight : bold; float : left; width : .75em;">

Coba paste berikut ke dalam editor HTML kamu:


<span style="font-size : 200%; font-weight : bold; float : left; width : .75em;">T</span>his paragraph has a drop-cap on the first character that should be visible to browsers like Internet Explorer 4 and 5. It will work in Netscape 4 as well, but you need to play around with the width of your letter to find the right size. <br clear="all" />
atau..............................coba yang ini

<span style="font-size : 200%; font-weight : bold; float : left; width : .75em; background-color : #cc0000; color : #cccccc;">Y</span>ou can even play with other style attributes on your drop-cap. Just remember to test in both Internet Explorer and Netscape, so you're not surprised by how your page looks. <br clear="all" />



Percobaan CSS................................

Robot Paling Cerdas di dunia ''TAHUN 2012''

Coba tebak apakah wanita cantik ini manusia atau robot ???Di luncurkan pada pameran Robot di Hongkong  “Robots in Motion 2012″ Expo''
one of the world’s most sophisticated (and beautiful)robots came to life.
begitulah mereka menyebutnya''robot yang hidup dan yang paling cantik
dan diberi nama ""Female Android Geminoid F''.

Bayangkan sebuah dunia di mana robot melakukan lalu lintas, bekerja di pabrik,membuat lantai sushi dan vakum kantor. Ini mungkin tidak jauh.
Di Jepang, robot sudah di gunakan untuk mengerjakan perlengkapan umum, dan prototipe terbaru datang semakin dekat kepada orang-orang yang memisahkan garis dari mesin.


Minggu ini, selama kunjungan pertamanya ke Hong Kong, perempuan android GeminoidF mengobrol, bernyanyi dan tersenyum sedangkan orang banyak terpesona menjepret foto.


Pencipta-Nya, Jepang robotika, guru Hiroshi Ishiguro, diprogram built-in komputernya dengan 65 perilaku, membuat satu-satunya  robot dunia yang paling cerdas.

http://spectrum.ieee.org/automaton/robotics/humanoids/040310-geminoid-f-hiros...
Developed by Prof. Hiroshi Ishiguro at Osaka University and ATR.
PROFIL Prof. Hiroshi Ishiguro PENCIPTA ROBOT INI :

Born	Hiroshi Ishiguro
Nationality	Japanese
Occupation	Engineer
Employer	Osaka University

Professor Hiroshi Ishiguro (石黒浩 Ishiguro Hiroshi) is director of the Intelligent Robotics Laboratory, part of the Department of Systems Innovation in the Graduate School of Engineering Science at Osaka University, Japan. A notable development of the laboratory is the actroid, a humanoid robot with lifelike appearance and visible behaviour such as facial movements.

In robot development, Professor Ishiguro concentrates on the idea of making a robot that is as similar as possible to a live human being; at the unveiling in July 2005 of the "female" android named Repliee Q1Expo, he was quoted as saying "I have developed many robots before, but I soon realised the importance of its appearance. A human-like appearance gives a robot a strong feeling of presence. ... Repliee Q1Expo can interact with people. It can respond to people touching it. It's very satisfying, although we obviously have a long way to go yet." In his opinion, it may be possible to build an android that is indistinguishable from a human, at least during a brief encounter.

Ishiguro has made an android that resembles him, called the Geminoid. The Geminoid was among the robots featured by James May in his 5 October 2008BBC2 documentary on robots Man-Machine in his series Big Ideas. Ishiguro has been listed as one of the 15 Asian Scientists To Watch by Asian Scientist Magazine on 15 May 2011.

Career

• 1986.3 : Graduate of University of Yamanashi
• 1991.3 : Graduate of the Graduate School of Engineering Science at Osaka University
• 1994.10 : Associate Professor at Kyoto University
• 1998.3 : Visiting Fellow of University of California, San Diego
• 2000.4 : Associate Professor of Wakayama University
• 2001.4 : Professor of Wakayama University
• 2003.4 : Professor of Osaka University

Awards

• Best paper award at the 4th ACM/IEEE International Conference on Human-Robot Interaction (HRI 2009), March 2009
• Best paper and poster awards at the 2nd ACM/IEEE International Conference on Human-Robot Interaction (HRI 2007), March 2007
• Best Humanoid Award (Kid size) at RoboCup 2006 (Bremen, Germany).