[عزف الموسيقى] ALLISON BUCHHOLTZ والاتحاد الافريقي: لذلك نحن في الأساس مجرد الذهاب لتعطيك المتهدمة من CSS، لأننا نعرف الذي لم يتم التطرق اليه في جميع الأقسام. ونحن نريد حقا للتأكد من أن لك الرجال لديهم هذه وسيلة تحت تصرفكم، لأنه لديه القدرة على اتخاذ مواقع الويب الخاصة بك تبدو أجمل من ذلك بكثير. 

وإذا كنت بناء موقع على شبكة الانترنت، ثم ربما كنت تريد أن تجعل من جميلة. أعني، لم يكن لديك ل، ولكن أود أن اقترح عليه. [يضحك] إذا كنت تريد للمستخدمين لاستخدام ذلك، وكنت قد تريد أن تجعل من قليلا [غير مسموع]. لذلك نحن ذاهبون لمحاولة وتعطيك فقط بعض الأدوات الأساسية والتفاهم، بحيث عند الخروج وكنت البحث الأشياء عن CSS، انها ليست استكمال رطانة، مثل CSS أحيانا أن تكون. 

TOMAS REIMERS: نعم. وقال أليسون جيدا جدا. لذلك أعتقد أن أول شيء نحن ينبغي أن تبدأ مع ما هو CSS؟ حتى CSS رائع. CSS-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: هذا اسم ندوة لدينا. 

TOMAS REIMERS: نعم. من المهم حقا أن عليك أن تدرك أن بحلول ذلك الوقت. إذا كنت تأخذ فقط بعيدا واحدة شيء، فهو أن CSS إذا رهيبة. الثاني هو CSS لتقف على صفحات الطرز المتراصة. حتى في صميمها، CSS هو ورقة أنماط، وهذا يعني فإنه يسمح لك لأسلوب صفحة على شبكة الإنترنت. ثم ماذا يعني ذلك، انها طريقة لإضافة نمط إلى مواقع الويب الخاصة بك. ذلك النمط، ونحن هنا نتحدث عن كل شيء هذا ليس structural-- من الأشياء مثل الألوان، الخلفية صور، والحدود، مثل، الحشو، الهوامش. سوف نتحدث عن ما كل هذا يعني في شيء. 

لذلك قمنا انتهت للتو قدما و افتتح كل من هذه حتى في جي إديت. لذلك هذا هو index.html و. وهذا هو main.css. حتى main.css لا يملك شيئا. ALLISON BUCHHOLTZ والاتحاد الافريقي: لا أسلوب حتى الآن. TOMAS REIMERS: لا شيء. وكما سترى، انها موقع القبيح حقا. ALLISON BUCHHOLTZ والاتحاد الافريقي: انها مجرد سهل. TOMAS REIMERS: نعم. نعم، انها ليست قبيحة، انها مجرد الحد الأدنى. ثم لدينا هنا index.html و. وذلك لسريعة خلاصة من HTML، أليسون، كنت تريد أن مجرد الحديث عن الصفحة؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: نعم. لذلك من الواضح، لدينا HTML العلامة، التي أسماء فقط ملف HTML. لدينا رأس لدينا هنا، مع CSS الذهول، which-- إذا كنت أعود. أين هذا؟ 

TOMAS REIMERS: أوه. نعم، يمكنك أن ترى. ALLISON BUCHHOLTZ والاتحاد الافريقي: وتلاحظ رأس هو هذا الرأس علامة التبويب الحق هنا. ثم "مرحبا، العالم!" غير النص الذي لدينا فقط عرض على شبكة الإنترنت الصفحة التي is-- العودة. العودة. الذي هو مجرد في أجسامنا here-- نص عادي. أيضا، شيء واحد ل ملاحظة، إذا نظرتم هنا، تحولت توماس تصل هذه اثنين من شريحة لدينا. ما دام لديك كل ثلاثة من هذه، وكنت على ما يرام. ويمكن أن تكون في أي أمر يريدونه. ما هو أهم هو أن فقط لديك كل من هذه الأمور الثلاثة. 

TOMAS REIMERS: بارد. إضافة نوع وثيقة؟ ALLISON BUCHHOLTZ والاتحاد الافريقي: نعم. TOMAS REIMERS: نعم. باردة. ALLISON BUCHHOLTZ والاتحاد الافريقي: على ما يبدو، ميكروفونات بلدي لا يحبون لي. TOMAS REIMERS: أوه، تعطينا ثانية فقط في حين أليسون مفاتيح من هيئة التصنيع العسكري لها. لذا نعم. لذلك لدينا الصفحة الرئيسية لدينا. انها نوع من unstyled. نحن ليس لدينا الكثير. لدينا فقط النص أساسا. لدينا ورقة الأنماط. لدينا العنوان. حتى مجرد عارية الجوفاء مكونات تجعل موقع على شبكة الانترنت. 

لذا من هناك، دعونا الحديث عن ما هو CSS وما يبدو وكل ذلك. وذلك لthat-- ALLISON BUCHHOLTZ والاتحاد الافريقي: العودة إلى الشرائح. TOMAS REIMERS: عودة إلى الشرائح. ويمكن أليسون تولي المسؤولية. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: وو. موافق. حتى في ملف CSS الخاص بك، كنت ستكون لدينا الكثير من هذه الأشياء تسمى محددات. وسيكون ذلك مجرد أساس ملف CSS الخاص بك. انها مجرد ستكون الكثير والكثير من هذه. لذا محدد. هذا هو مجرد علم التشريح العام. ونحن في طريقنا للذهاب من خلال الأمثلة، لأنه إذا يا رفاق أبدا شاهدت مقطع بلدي، وأنا أشعر مثل الأشياء بصورة مجردة لا تجعل حقا معنى. كما أنه يساعد دائما أن نرى الأمثلة. 

لذلك لدينا بعض محدد. التي ستكون بعض معرف ل ما نريد أسلوب لتطبيق. وبعد ذلك يمكن أن يكون أي مجموعة من القواعد والقيم. حتى محددات التي قد تراها قد يكون شيئا مثل الجسم، أو الفقرة مع P، أو رأس، أو أيا كان، كل ما تريد علامات HTML الخاصة بك لتكون. 

حتى في هذه الحالة، لدينا الجسم. ولدينا بعض الحكم، هذا الذي يتوافق ما طريقتك ينطبق على. حتى في هذه الحالة، لدينا لون الخلفية والخط الوزن. لذلك هذا هو الذهاب الى تغيير خلفية أي شيء في أي العلامة الجسم من ملف HTML لدينا. وانها سوف تعطي انها هذه القيمة الضوء الأزرق. 

لذلك يجري لجعل خلفية الأزرق الفاتح. ثم أي شيء داخل الجسم ستكون لدينا الوزن الخط الغامق. حتى انها مجرد الذهاب الى جريئة كل من نصنا. وهذا هو اختيار واحد فقط. ولكن هل يمكن أن يكون الكثير جدا من هذه. وكما أننا ذاهبون لاظهار أكثر في وقت لاحق، وقليلا في كيفية أن الأعمال والمزيد من الأمثلة هناك. أي شيء تريد أن تضيف؟ 

TOMAS REIMERS: رقم أليسون حصلت عليه. نحن مجرد الذهاب إلى تقطيع ل المثال هنا في الموقع مثالنا. لذلك دعونا نغتنم هذه في الواقع. انها مثالية. لذلك أنا ذاهب لمجرد نسخ ولصق هذا الحق في ملف وmain.css لدينا. وانا ذاهب لحفظه. وبعد ذلك سوف تشغيله. ملاحظة جانبية لذلك، واحدة من معظم الأشياء المحبطة وإذا لم تقم بحفظ الملف، و ثم لك، مثل، إعادة تحميل الصفحة، ومثل، لماذا لا التغيير يحدث؟ يحدث ذلك. حتى هنا رأينا أن قطعناها على أنفسنا لدينا موقع خلفية زرقاء خفيفة والغامق بعض النص. 

أود أن أذكر أيضا، إذا كنت الرجال لديهم أسئلة حول أي شيء نقوم به، فلا مجانا لمنعنا وتطلب منا. نحن على استعداد تماما على الأسئلة الحقل. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: من الواضح، مع CSS، كل شيء يعتمد على نفسها. حتى إذا كان هناك شيء واحد لا معنى الآن، ونحن لا نريد أن تعثر لك باستمرار في وقت لاحق. 

TOMAS REIMERS: لذلك دعونا نوع من تشريح هذا. لذلك كنت تريد أن تبدأ مع محدد هنا؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: نعم. كما كنت أقول من قبل، الجسم هو مجرد لدينا محدد هنا. حتى إذا ذهبنا إلى أكثر من لدينا آه index--. 

TOMAS REIMERS: ما أنا أغلقت فقط. أعطني الثانية. حتى ملف، فتح، index.html و. ALLISON BUCHHOLTZ والاتحاد الافريقي: بارد. لذلك إذا لاحظت هنا، ونحن لديك هذه العلامات الجسم، أليس كذلك؟ لذا محدد يتوافق فقط ل العلامات التي نتحدث عنها. لذلك الجسم هنا. فما نقوله هو everything-- يمكن أن نعود؟ أتمنى أن فقط مثل لمس الشاشة. انها تريد ان تكون أكثر برودة من ذلك بكثير. 

لذا فان أي شيء داخل تلك العلامات الجسم، والتي رأينا كان مجرد، مثل، النص، والجسم بشكل عام يشير إلى، مثل، الخلفية. إذا كنت تريد من أي وقت مضى تغيير الخلفية، التي ستكون في علامة الجسم. للتو هذه القواعد يطبق عليهم. 

حتى لو كنا للذهاب الى index.html وand-- في الواقع، يمكن أن يكون لدينا شيء خارج الجسم؟ لو كان لدينا، مثل، تذييل أو شيء ما، فإنه لا ينطبق على هذا. ولكن أي شيء داخل هذه العلامات الجسم يسير أن تتأثر هذه الهيئة محدد الذي حققناه. حتى لو كنت لاكتب شيء آخر there-- 

TOMAS REIMERS: دعونا قيادة هذا الوطن. حتى إذا كان لدينا div-- ذلك أن مجرد علامة أخرى يمكن أن يكون. انا ذاهب لإغلاقه. أو دعونا جعل هذه الفقرة. لذلك ص لتقف على الفقرة. وضمن تلك الفقرة. وبعد ذلك يقول: "هذا هو النص". باردة. وبعد ذلك جعلت هذه القاعدة تنطبق على فقرة بدلا من الجسم. سترى كيف ينطبق فقط على الفقرة التي شكلت حديثا، والحق، ليس كل شيء. هل هذا يعقل؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: لذلك هذا هو كل الجسم، ولكن الآن لدينا فقط محدد يتوافق مع الفقرة. لذلك لدينا فقط جريئة والأزرق لهذه الفقرة محددة، لأن هذا هو الشيء الوحيد هو أن المرفقة ضمن العلامة ص. 

TOMAS REIMERS: هل هذا معقول نوعا من كيف تسير الامور تغليف أشياء أخرى؟ ALLISON BUCHHOLTZ والاتحاد الافريقي: أيضا، فقط أن أقول، مثل، واحدة من أفضل الطرق للحصول حقا مريحة مع CSS هو فقط أن تفعل أشياء مثل هذه، مجرد محاولة ذلك. انها بسيطة جدا لكتابة شيء خارج، وضرب تحديث، ونرى ما سيحدث. وكما هو الحال مع معظم CS، يمكن التجريب في كثير من الأحيان يؤدي إلى أفضل بكثير فهم بديهية. حتى أكثر من ذلك أكثر منا فقط، مثل، الحديث معك. 

TOMAS REIMERS: بالتأكيد 100٪ يوافقون على هذه النقطة. حتى إذا رجعنا إلى هذا، دعونا نبدأ تشريح بالضبط ما هذين القيام به. لذلك لدينا اثنين من قواعد في هذا الشأن. لذا فإن أول واحد هو لون الخلفية. وترى أن لدينا تعيينها يساوي قيمة والأزرق الفاتح. 

حتى في CSS، CSS هو نوع من فضفاضة جدا حول كيفية كنت يسمح لك لتحديد اللون. حتى تتمكن من تحديدها بالاسم. كما يمكنك أن تفعل شيئا مثل "أحمر". ثم إذا عدنا إلى ذلك، سترى أن خلفية حمراء. يمكنك أيضا الحصول على really-- أعتقد أنك يمكن الحصول على الإبداع جميلة مع هذا، لا يمكن لك؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: I تعتقد أنك يمكن أن تستخدم عرافة. لا يمكن لك؟ 

TOMAS REIMERS: نعم. بحيث يمكنك استخدام عرافة. ولكن أنا أفكر اسم حكيم. ليست هناك؟ ALLISON BUCHHOLTZ والاتحاد الافريقي: يمكنك أن تفعل غير قليل. الى حد كبير مثل معظم الألوان التي يمكن name-- مثل، وأعتقد أن سمك السلمون واحد. 

TOMAS REIMERS: نحن السلمون سأحاول. ALLISON BUCHHOLTZ والاتحاد الافريقي: I أعتقد أخضر مصفر هو في هناك. TOMAS REIMERS: نعم. ترى؟ حتى تتمكن من الحصول على خلاقة جدا. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: أنت يمكن الحصول على الإبداع جدا. مثل، إذا يمكنك التفكير في اسم اللون، انها على الارجح في هناك. إذا كنت تريد حقا غرامة التفاصيل، يمكنك الذهاب عرافة. 

TOMAS REIMERS: نعم. عشري ذلك. إذا يا رفاق نتذكر هذه العودة من PSET القديم الخاص بك، صورة استرداد، كان يا رفاق التعامل مع هذه القيم عرافة. ونوع من لنلخص ما هو أنه، عرافة ثلاثة القيم المخزنة في ذلك. لذلك فمن في مجموعات من اثنين من الزيادات. الأولين تمثل قيمة الحمراء. يمثل ثانية واحدة قيمة الخضراء. وآخر واحد هو الأزرق؟ 

حتى FF يحدث لتمثيل ست عشري 255. بحيث يكون لديك 255 الأحمر، 255 الأخضر، والأزرق 0 ل. وتتراوح قيم بين 0 و 255. 

الجمهور: الحق. ذلك أساسا، فإننا لا يمكن بحث في الإنترنت عن أي لون نريد، وتحديد المعروفة في الواقع لون الطيف التحرير والسرد، وبعد ذلك يتمكن من تسديدها في؟ ALLISON BUCHHOLTZ والاتحاد الافريقي: بالضبط. بحيث يكون لديك السيطرة الكاملة الى حد كبير أكثر من الألوان التي تريدها ضمن CSS. هل نحن بصدد الحديث عن صور الخلفية في وقت لاحق؟ أم أننا نريد أن نفعل ذلك؟ 

TOMAS REIMERS: نعم. على الاطلاق. ذلك لأول مرة، فقط لاظهار أن الأحمر والأخضر أصفر. وإذا كنت بحاجة الى بعض مساعدة في العثور على هذا، كنت يمكن جوجل شيء مثل "لون منقار". ALLISON BUCHHOLTZ والاتحاد الافريقي: أوه، انها جيدة جدا. أنا أحب اللون المنتقى. 

TOMAS REIMERS: colorpicker.com هو مثال جيد. وهنا، سترى أن لديك لون منقار فوتوشوب تشبه الكامل. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: مم-HM. أيضا، تهدئة الامور هي لك يمكن أن تولد الألوان بحيث لم يكن لديك، مثل واشتبكوا الألوان. TOMAS REIMERS: وبعد ذلك وهنا قيمة تصل عرافة هنا. لذلك يمكنك أن تجد دائما على الانترنت الأساس الأماكن للحصول على قيمة عرافة من. انها ليست فرز من ذلك تماما، مثل، نحن رؤية الألوان من العالم في الأرقام. انها أكثر أن نذهب على الانترنت وتجد ما لون نريد، ومن ثم اتخاذ عدد أسفل. لأنه مجرد من السهل حقا طريقة لمرجع الأمور في CS. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: وبعد ذلك هناك also-- أنسى الاسم الدقيق للموقع. ولكن هناك بالتأكيد، وأنا أعتقد، شيئا من أدوبي الذي يولد الألوان بالنسبة لك، وهو رائع حقا، لأنك definitely-- أنه في بعض الأحيان من الصعب معرفة، أوه، إذا كنت ترغب في استخدام هذا اللون، ما قد يكون مفيد أخرى استخدام في أي مكان آخر على موقعي ل، مثل، وجعلها جميلة ومتماسكة. 

TOMAS REIMERS: أليسون نتحدث عن واحدا تلو أدوبي دعا Kuler، على ما أعتقد. انها K-U-L-E-R. ALLISON BUCHHOLTZ والاتحاد الافريقي: أعتقد ذلك. أنا متأكد من أن هذا واحد. 

TOMAS REIMERS: بلدي المفضل لديه كان دائما نظام الألوان مصمم. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: أوه. 

TOMAS REIMERS: أيهما now-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: آه، وهذا هو الجميل. 

TOMAS REIMERS: وأنت يمكن القول أساسا، مثل، أريد ثلاثة ألوان بجانب بعضها البعض. ثم دعونا نفعل شيئا لطيفا. ثم يمكنك الحصول على سبيل المثال ما قد تبدو. ثم إذا كنت تحوم فوق أي من لهم، فهو يوفر لك قيمة ست عشرية. 

حتى مجرد وسيلة جيدة للبدء التفكير في أنظمة الألوان أو ما هي الألوان في موقع على شبكة الانترنت قد يذهب معا بشكل جيد. لأن ذلك يمكن أن يكون من المستغرب ليس من السهل اختيار كما كنت أعتقد. ثم الشيء الآخر بارد لقد وجدت دائما عن هذا الموقع هو إذا كنت أصاب أمثلة، وأنها سوف إظهار ما على سبيل المثال موقع قد تبدو وكأنها استخدام تلك الألوان. على أي حال. 

العودة إلى CSS الفعلي. ALLISON BUCHHOLTZ والاتحاد الافريقي: ولكن من الواضح، أننا أعرف قد تكون هذه المراجع مفيدة. TOMAS REIMERS: لا، إنهم بالتأكيد يمكن أن تكون مفيدة. ولذلك فإن القاعدة الثانية، أليسون؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: نعم. القاعدة الثانية هي مجرد الموافق الخط لدينا. حتى وزن الخط هو نوع فقط of-- ذلك فإن الوزن يكون إذا كنت ترغب فقط، مثل، عادي أو، مثل، الخطوط أرق، أو في هذه الحالة، مثل، جريئة. أنسى. ما هو إذا أردت it-- هناك واحدة أرق من مجرد، مثل، طبيعي؟ TOMAS REIMERS: أنا لا فعلا معرفة ما إذا كان هناك واحد أرق. ALLISON BUCHHOLTZ والاتحاد الافريقي: انسى. وزن الخط ولذا فإننا عادة مجرد استخدام لجريئة. إذا كنت ترغب في الحصول حقا في ذلك، نحن ذاهبون لتظهر لك. W3Schools لديه كل مختلفا الأشياء التي يمكنك القيام به لالخطوط. ولكن في الأساس، إذا كنت تريد من أي وقت مضى لتغيير أي شيء عن الخط، انها دائما ما يكون، مثل، الخط شيئا. لذلك سوف يكون مثل، الخط بين أفراد الأسرة إذا كنت في محاولة لتغيير نوع الفعلي. انها سوف تكون على غرار الخط إذا تريد أن تجعل من مثل مخطوطة، أو مائل، أو غيرها. أو حتى الخط لون، إذا أردنا تغيير ذلك. 

TOMAS REIMERS: نعم. حتى تتمكن من تغيير ذلك. ونوع من مجرد ل خلاصة الآن، حتى تتمكن من نرى أن لدينا محدد هنا. لدينا هذه الأقواس المعقوفة. ومن ثم لدينا قواعد محددة بفواصل منقوطة. هل هذا يعقل؟ نعم؟ باردة. حتى إذا كان هذا هو good-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: عودة. TOMAS REIMERS: دعونا نتحدث تحديدا عن أي نوع من محددات لدينا. 'سبب الآن قمنا علامات نوع من إظهار فقط. ولكن يا رفاق يمكن أن نرى من المعقول. ويقول لديك فقرتين على صفحة ولك تريد أن تكون قادرة على النمط واحد ولكن ليس الآخر، كنت لا تريد فقط للحد من نفسك لديك لاستخدام مختلفة HTML الفعلية علامات لمنحهم أنماط مختلفة. 

لذلك لدينا ثلاثة الأساسية أنواع من محددات. ALLISON BUCHHOLTZ والاتحاد الافريقي: نعم. لذلك لدينا العلامة، وهو ما كنا نتحدث عن الوقت الحالي. ولهذا النوع من مثل جسمك أو ص. ومن ثم لدينا الطبقة، وهو عندما نحدد في ملف CSS لدينا، انها دائما ما تكون نقطة، أيا كان تريد اسم صفك أن يكون. وهذا يمكن أن تنطبق على أشياء متعددة. 

ويقول لديك خمس فقرات واثنين من ثلاثة منهم تحتاج إلى نصب نفسه، كنت تطبيق فئة لها. وهذا هو مجرد وسيلة ونحن نفعل ذلك. سنعطيك مثالا لل حيث يظهر هذا في الواقع يصل. ولكن إذا كان لديك ربما بعض الوسم ص، وبعد ذلك، سوف أكتب لكم، الطبقة يساوي مهما الطبقات تريد تطبيق لها. وبغض النظر عن محددات الطبقة التي نريد لتطبيق هذه الفقرة محددة، نحن يمكن أن يكتب مثل هذا. بالطبع، وأعتقد أن مثال سوف جعله أكثر من ذلك بكثير الخرسانة. 

والآخر لدينا غير معرف، ونحن دلالة مع تجزئة، أو الجنيه، أو الوسم. TOMAS REIMERS: Octothorpe. ALLISON BUCHHOLTZ والاتحاد الافريقي: Octothorpe. الذي يعمل أيضا. ويجب أن هذا واحد يكون حقا فريدة من نوعها. ينبغي أن تنطبق فقط على شيء واحد على الصفحة الخاصة بك. لذلك سواء كان ذلك في فقرة محددة، أو بعض البند في قائمة، أو أيا كان، وهذا ينبغي أن تكون فريدة من نوعها. وبنفس الطريقة أننا فقط أقول، مثل، والطبقة = "CLASS1 CLASS2" وهذا يمكن أن يكون مجرد معرف أيا كان لدينا. TOMAS REIMERS: نعم. لذلك دعونا نتحدث بالتأكيد حول الأمثلة هنا. وأنا مجرد الذهاب للغوص مستقيم الظهر في التعليمات البرمجية. لذلك دعونا نلقي نظرة على لدينا HTML. ولذا فإننا حق دينا الآن فقرة واحدة. وهذا هو النص. أنا مجرد الذهاب الى تعديل ذلك. "هذا هو النص 1." ثم نحن في طريقنا ل لديها "هذا هو النص 2." 

ALLISON BUCHHOLTZ والاتحاد الافريقي: ثانية واحدة. TOMAS REIMERS: نعم. لذلك لدينا الآن "هذا هو نص 2"، أليس كذلك؟ ونحن في طريقنا لرؤية أنه إذا كنا تحميل الصفحة، ما نحن في طريقنا للبحث عن هو أننا كنت gonna find-- ALLISON BUCHHOLTZ والاتحاد الافريقي: أوه. TOMAS REIMERS: نعم. ونحن في طريقنا لإيجاد "هذا هو النص 1 "، و" هذا هو 2. النص " 

ALLISON BUCHHOLTZ والاتحاد الافريقي: و اللون الأصفر من جميل. 

TOMAS REIMERS: وسترى أن اختيار لدينا الآن، الذي ينطبق على بورز، أو الفقرات، ويؤثر كل منهما، لأن كلا منهم تلبية شرط أن انهم على حد سواء علامة ص. أن من المنطقي الكلي. لذا فإن السؤال هو، أيضا، ما إذا أردنا الحصول على واحد فقط؟ ذلك بالضبط مثل أليسون كان يقول، لدينا اثنين من طرق أخرى للقيام بذلك. أنا ذاهب لبدء مع معرف. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: دعونا نبدأ مع معرف. 

TOMAS REIMERS: وعلى حد سواء من هذه هي الصفات. لذلك توجد سمات في HTML. وما هي عليه هو شيء التي تضيفها داخل علامة الذي هو فصل من اسم العلامة. حتى تتمكن من سمات متعددة. نعم؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: كنت مجرد الذهاب أن أقول، من مثال بك من PSET 7، إذا كان أي من محاولة محاذاة الأشياء إلى المركز، كنت قد استخدمت "النص محاذاة = الوسط." وهل لاحظت أنه ربما يجب أن تركز النص الخاص بك أو شريط التنقل الخاص بك. ولهذا فقط أيضا سمة التي قد تكون على دراية. TOMAS REIMERS: هناك حفنة من السمات التي سترى. نعم. مثل إشارة جيدة لPSET 7. لدينا معرف. هل يمكن أن يكون أيضا الطبقة، وأشياء من هذا القبيل. وهناك علامة واحدة يمكن أن يكون لها العديد من الصفات. ذلك بدءا من الهوية، ودعونا نتظاهر نحن تريد أن يكون لها هوية of-- أنا لا أعرف. ونحن سوف يطلق عليه خاصة، لأن هذا واحد، ونحن الذهاب الى جعل جريئة، و تأكيد، وأيا كان. ALLISON BUCHHOLTZ والاتحاد الافريقي: انها سيصبح فائقة خاص. TOMAS REIMERS: هذا واحد، لدينا معرف خاص. وبالتالي فإن الطريقة لتحديد ذلك، إذن، هو في main.css، بدلا من أن يكون علامة ص، تفعل #special، OK؟ والذي يحدد الشيء مع معرف خاص. هل هذا يعقل أن الجميع؟ الجمهور: نعم. TOMAS REIMERS: بارد. حتى الآن إذا عدنا، سنقوم see-- يصيح. نعم. سنرى أنه يختار فقط واحد مع معرف خاص. نعم؟ يبدو باردا. نعم. 

الجمهور: هل يمكن أن يكون لها شيء يعزو كل الطبقة وهوية؟ 

TOMAS REIMERS: نعم. الحضور: OK. ثم ماذا يحدث إذا كنت ثم إعطاء انها بعض القواعد في CSS ذلك الصراع؟ TOMAS REIMERS: بالتأكيد. نحن بالتأكيد للحديث عن ذلك. ذلك بالضبط ما كنت الحصول على في، هل يمكن أن يكون أيضا الطبقات. لذلك دعونا نتظاهر كان لي ثلاث فقرات وI أراد أن أسلوب أول اثنين ولكن ليس الثالث. حسنا، قد تكون فكرة الأولى للمنتدى، حسنا، أنا يمكن أن مجرد إعطاء ثانية واحدة على الهوية. ولكن لا تستطيع، لأن الهوية، تماما مثل أليسون كان يقول، يجب أن تكون فريدة من نوعها. 

وذلك بدلا من الهوية، ما كنت يمكن استخدام غير يمكنك استخدام فئة. وclass-- ما يسمح لها يمكنك القيام به هو القول أساسا، هذا ينتمي كجزء من مجموعة. في هذه الحالة، لدينا مجموعة ويسمى الخاصة. وماذا نحن في طريقنا للقيام بعد ذلك هو ونحن في طريقنا إلى say-- بدلا من الجنيه، ونحن في طريقنا لاستخدام نقطة. موافق؟ وتلاحظ أن الجنيه ونقطة وجود لها إلا داخل ملف CSS، لا داخل HTML. ALLISON BUCHHOLTZ والاتحاد الافريقي: نعم. تمييز مهم. 

TOMAS REIMERS: لدي وكان الكثير من النضال، لأنني وضعت التجزئة في HTML و ثم شعرت مجرد غبي لفترة طويلة. انظر كيف يختار كلا من هم مع تلك الفئة؟ باردة. 

الآن، وأشياء يمكن أن يكون فئات متعددة. دعنا نقول أردت أن تجعل أول اثنين من لديهم خلفية من اللون الأصفر وثاني اثنين ديك لون الخط الأزرق. موافق. أنا لا أعرف حقا لماذا فما استقاموا لكم فاستقيموا تريد أن تفعل ذلك، ولكن أستطيع. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: قد لا المستحسن لموقع الويب الخاص بك. ولكن لأغراضنا، وأنها سوف تفعل. 

TOMAS REIMERS: انها ليست مخطط اللون جيدة. ALLISON BUCHHOLTZ والاتحاد الافريقي: حسنا، الأصفر والأزرق هي بلدي الألوان المدرسة الثانوية. أنا لا أعرف، وإن كان. TOMAS REIMERS: اعلى مستوى أليسون وكانت المدرسة مخطط اللون كبيرة. [ضحك] حتى ذلك الحين ما يمكن أن نطلق هذا هو دعونا ندعو this-- لذلك لدينا الخاصة ولدينا جميلة. أقترح، لهذا، يمكنك استخدام أسماء وصفية أكثر من ذلك بكثير. ALLISON BUCHHOLTZ والاتحاد الافريقي: نعم، أود أن نسمي هذا، مثل، الأصفر أو الأزرق. 

TOMAS REIMERS: نحن لسنا حقا جعل موقع على شبكة الانترنت الحقيقي، وهذا هو السبب نحن لا نفعل ذلك. ولكن إذا كنت في الواقع وكان موقع على شبكة الانترنت الحقيقي، وكنت قد يكون لديك، مثل، رأس المقال، المحتوى المادة، الكلمة الأولى، أشياء من هذا القبيل، والتي تسمح عليك أن تكون أكثر وصفي بكثير. وهذه هي في الحقيقة مجرد مثل المتغيرات. وينبغي الكشف عن اسمه بطريقة فيها يمكنك، like-- نعم، على هذا النحو. الكمال. 

حتى لون الخلفية. وبعد ذلك نحن ذاهبون الى say-- ذلك طريقة لتغيير لون هو مجرد "لون". ونحن في طريقنا لجعله الأزرق. هذا بارد. حتى الآن لدينا الأول لهما خاص. ما يحدث احدة المقبل ل لدينا "الطبقة = جدا." ALLISON BUCHHOLTZ والاتحاد الافريقي: ومن ثم عليك تريد أن تضيف "جميلة" لواحد الأوسط. TOMAS REIMERS: نعم. ومن ثم إلى منتصف واحدة، لإضافة "جميلة" ما يحدث هو لديك مجرد الفضاء. لذلك سمة الفئة هي قائمة مفصولة الفضاء جميع الفئات التي تنطبق على هذه العلامة. موافق؟ انها ليست مثل هذا واحد ينتمي ل نوع من فئة خاصة تسمى "خاص، والفضاء، إلى حد ما." انه ينتمي الى اثنين classes-- خاصة وجميلة. نعم؟ باردة. 

ثم إذا نظرنا في ما يحدث، ونحن سنرى أن أول واحد لديه خلفية صفراء، نص أسود. one-- الثانية 

ALLISON BUCHHOLTZ والاتحاد الافريقي: --has جريء خلفية صفراء مع النص الأزرق. ولنا الماضي واحد لديه فقط النص الأزرق أننا المسندة إليها. 

TOMAS REIMERS: بارد؟ كيفية عمل محددات؟ رائع. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: هل نريد ل الحديث عن الصراع الان بعد ذلك؟ 

TOMAS REIMERS: نعم ذلك. على الاطلاق. فما يحدث إذا لديهم الصراع، أليس كذلك؟ دعونا نتظاهر أول واحد يضع شيئا like-- ALLISON BUCHHOLTZ والاتحاد الافريقي: ربما هذا واحد يغير الخلفية؟ TOMAS REIMERS: نعم. لذلك نحن ذاهبون لجعل "جميلة" تغيير الخلفية لسمك السلمون. ALLISON BUCHHOLTZ والاتحاد الافريقي: أنت فقط مع كل الألوان كبيرة اليوم، توماس. TOMAS REIMERS: نعم. لأنني اكتشفت يمكنني استخدام سمك السلمون كلون الحقيقي. لذلك نحن لن يؤدي الا الى أن تفعل ذلك. وأعتقد أيضا الغروب هو اللون الحقيقي. الجمهور: هو غروب الشمس لون حقيقي؟ ALLISON BUCHHOLTZ والاتحاد الافريقي: دعونا نحاول ذلك. TOMAS REIMERS: بعد هذا العرض فقط لأن في حالة أنه عبث تصل، أنا لا أريد أن يكون التصحيح. حتى نعرف سمك السلمون هو لون حقيقي. لذلك أي التخمينات على ما الذي سيحدث؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: أي فكرة؟ 

الجمهور: (غير مسموع). 

TOMAS REIMERS: نعم. لذلك كنت حصلت عليه الحق بالضبط. في الأساس، فإنه يأخذ القاعدة الأخيرة التي أعطيت له. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: لذلك هذا هو حيث المتتالية حيز التنفيذ. 

TOMAS REIMERS: حتى نتذكر كيف كنا وكان أن أوراق الأنماط المتتالية؟ ذلك أن، نحن نوع من يعني ان لدينا مجموعة من القواعد التي تنطبق على رأس كل منهما الآخر، و ويمكن أيضا تجاوز بعضها البعض. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: لذلك كل ما في أسفل ستتجاوز كل ما هو في الأعلى. هل يمكن أن يكون القواعد التي تماما ينفي شيئا مسبقا. وهذا أيضا لماذا كنت تريد أن تكون حذرا عندما كنت التصميم، لذلك كنت لا خلق القواعد التي كنت مجرد تجاوز تماما. 

TOMAS REIMERS: أو ربما كنت لا تريد الكتابة القواعد. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: أو ربما لديك. نعم. 

TOMAS REIMERS: نتظاهر لديك الطبقة التي تنطبق على معظم الأشياء، ولكن دعونا نقول لكم تريد تغيير لون الخلفية إلى اللون الأحمر والخط الوزن إلى جريئة بالنسبة لمعظم الأشياء، ولكن لأحد، تريد فقط لون الخلفية أن يكون أحمر ولكن تريد كل الآخر خصائص، هل يمكن أن تفعل شيئا مثل "الخط الوزن = طبيعي" التي من شأنها أن ثم التراجع عن هذا التغيير الجريء. نعم؟ مرة أخرى، فإن أفضل طريقة، وأعتقد وقال أليسون، يتم ممارسة فقط. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: التجريب. 

TOMAS REIMERS: الممارسة، والممارسة، الممارسة، والتجربة. أنا أعرف الكثير من الناس يعتقدون CSS هو مجرد الكثير من التخمين والاختيار في نهاية اليوم، حيث إذا كنت تريد أن تفعل مثل something--، لديك فكرة تقريبية، ولكن كنت لا تزال ربما تحتاج لذلك في محاولة للتأكد من كنت تعرف ما يبدو. 

الجمهور: عند الانتهاء من تطبيق الطبقات، وأكثر من واحد إلى نفس الفقرة أو القسم، أليس كذلك النظر عن الترتيب الذي يمكن اكتب لهم في يقتبس؟ 

TOMAS REIMERS: لا، ليس على الإطلاق. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: ما يهم هو النظام داخل ورقة الأنماط CSS الخاص بك. الجمهور: هل يمكنك تكرار السؤال؟ TOMAS REIMERS: أوه. ALLISON BUCHHOLTZ والاتحاد الافريقي: ضمن الطبقة، وعندما كنت إعطاء دروس إلى شيء في HTML، يفعل يهم أي ترتيب انهم في؟ لا يهم هذا الأمر. ما يهم هو ترتيب محددات الطبقة داخل CSS الخاص بك، ضمن ورقة نمط حياتك. 

TOMAS REIMERS: جيد الصوت؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: جميل. 

TOMAS REIMERS: وبعد ذلك ونحن في طريقنا لمواصلة علي: ALLISON BUCHHOLTZ والاتحاد الافريقي: ماذا لدينا بعد؟ أنسى. أوه، لدينا فقط أمثلة. ولكن لدينا نوع من الانتهاء من تلك. فعلناه الأمثلة على الطاير. 

TOMAS REIMERS: نحن نصل الى الجمع بين محددات قريبا. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: أوه، نحصل على الجمع بين محددات. TOMAS REIMERS: حتى بعض الأمثلة هي لدينا # الجنيه dog--، أو الوسم، أو octothorpe، أو أيا كان تريد الاتصال that-- حاد. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: كلب حاد. 

TOMAS REIMERS: ثم لديك .pets. شيء لديه معرف الكلب، هناك كلب واحد فقط على الصفحة. شيء لديه معرف القط، وهناك فقط القط واحد. قد يكون هناك العديد من الحيوانات الأليفة في الصفحة. هذا هو السبب في أننا أعطينا أن الطبقات. لديك مثال ص. وحتى ذلك الحين واحدة من المثال الأخير، الذي هو شيء ونحن لم نتحدث عن، ما يحدث عند الجمع بينهما. حتى p.pets. 

لذلك لذلك، دعونا نعود إلى رمز وإدخال another-- نعم. حتى هنا مرة أخرى. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: I يشعر وكأنه هذا هو really-- وكأنه مجرد النظر من خلال أمثلة هو في الواقع طريقة لتعلم هذا. وهذا ما نقوم به. 

TOMAS REIMERS: لذلك دعونا نتظاهر نحن أريد فقط لتحديد، والنص 2 الصحيح؟ ولذا فإننا بالتأكيد لا يمكن تفعل ذلك مع معرف. حسنا، نحن يمكن ان نفعل ذلك مع الهوية، لكنه لا يكون لها هوية. بوسعي أن أضيف واحد، ولكن دعونا نتظاهر أن لم أكن أريد أن أضيف واحدة أو لديه بالفعل شيء آخر. لا أستطيع أن أفعل ذلك مع ذلك. العلامة هي بالتأكيد ليست فريدة من نوعها، أليس كذلك؟ وليس هو الطبقة. ولكن يمكنك الجمع بين هذه الأمور. دعونا نقول أننا نريد أن نفعل شيئا الذي لا ينطبق إلا على الأشياء التي لديهم خاصة الطبقة و التي لديها الطبقة جدا. 

وذلك ما يمكنك القيام به هو في main.css، يمكنك القول، دعونا أولا حذف هذا. يمكنك الجمع بين هذه. حتى تتمكن من القيام .special. أي مساحة. فقط .special.pretty. ما يعنيه ذلك هو شيء الذي هو على حد سواء خاصة وجميلة. هل هذا يعقل؟ وإذا ذهبنا هنا، ما وأنت تسير لرؤية هو يطبق هذه القاعدة فقط ل والثاني، الذي على حد سواء من هؤلاء. ويمكنك أن تفعل ذلك لكثير من الأشياء. يمكنك say-- دعونا أدعي أنني أردت فقط أن تفعل أشياء التي لها الطبقة جميلة والتي هي أيضا علامة الفقرة. حتى p.pretty. دعونا نتظاهر بأن كان لي شيء جميل على الجسم العلامة. موافق؟ يمكنني تشغيل هذا وأنا يمكن أن نرى أنه فقط الذهاب الى تنطبق على الأشياء التي هي الفقرات مع الطبقة جميلة. ويمكنك الجمع بين هذه، في الأساس، وكثير ما تريد. حتى تتمكن من مجرد وضعها معا. هل هذا يعقل؟ ALLISON BUCHHOLTZ والاتحاد الافريقي: لذلك هذا النوع من هو أكثر فائدة عندما، توماس كان يقول في وقت سابق، وربما لديك موقع على شبكة الانترنت معقد للغاية، وكان لديك بالفعل الكثير هذه قواعد مكتوبة، وتحتاج فقط ل الجمع بين اثنين من قبل. مثل بدلا من كتابة ككل محدد الجديدة والمتغيرة عليه هناك، يمكنك الجمع فقط لهم حيث تتداخل. 

TOMAS REIMERS: أو لك قد تجد أحيانا out-- هناك فئة واحدة والتي يجعل لون الخط في مثل الأزرق، وهناك فئة أخرى التي يجعل الأزرق الخلفية. والتي لن تعمل فقط. حتى أن تكتب حالة خاصة، حيث، like-- ولكن إذا كان لديه على حد سواء، ما كنت تنوي القيام به هو كنت تريد الذهاب ل جعل هذا واحد هذا الظل الأزرق وهذا واحد هذا الظل غيرها من اللون الأزرق. أليس كذلك؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: جيد لتلك الأنواع من الاستثناءات. TOMAS REIMERS: لذا ل التفكير في المشاكل التي قد تنشأ عند الجمع بينهما. باردة. ويعود ذلك إلى العرض الذي قدمناه. ALLISON BUCHHOLTZ والاتحاد الافريقي: نحن تقريبا هناك. TOMAS REIMERS: وذلك توقف الاتصال. ALLISON BUCHHOLTZ والاتحاد الافريقي: أوه، لا. ALLISON BUCHHOLTZ والاتحاد الافريقي: CS في مكتب والإنترنت وتنخفض. أوه، والسخرية. 

TOMAS REIMERS: لذا لحسن الحظ، يمكننا تقديم من دون الإنترنت، أعتقد، لأن لدينا كافة الشرائح هنا. لذلك دعونا نتحدث عن العلاقة بين العلامات. ALLISON BUCHHOLTZ والاتحاد الافريقي: الحق. حتى مجرد نوع من الذهاب الخروج من ما قاله توماس، هذا هو مجرد طريقة أخرى للقيام بذلك. لذلك لدينا بعض الوالدين محدد مع اختيار الطفل. حتى في هذا المثال هنا، لدينا بعض الجسم مع الناف بار الطبقة، زر الصف. آه. 

TOMAS REIMERS: أوه، آسف. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: و في الأساس، ما يعني هذا وتحديد كافة الأطفال، مثل كل من هذه الأنواع من محددات، في هذا محدد الأم. وهؤلاء هم الوحيدون انها أي وقت مضى لتطبيق. أنا لا أعرف ما إذا كنت لديك طريقة أفضل of-- TOMAS REIMERS: لذلك أنا تخمين طريقة للتفكير في هذا هو تذكر قبل كيف نحن نوع من مثل وضعها معا. ثم وهذا يعني عنصر واحد والذي يطابق كل من هذه. ما هذا يقول هو، I أريد منك أن تتطابق كل شيء ضمن some-- أريد عليك أن تجد محدد. ثم ضمن ذلك، أريد لكم لمباراة أشياء جديدة. أليس كذلك؟ حتى في CSS، انها كل شيء عن نوع من أن تكون قادرة على تطابق هذه العناصر. ويمكنك محاولة لمطابقة البنود في غضون غيرها من البنود. 

لذلك دعونا نفعل فعلا على سبيل المثال، ونعتقد أن سوف توضيح. لذلك دعونا نتظاهر لدينا الخاصة، خاص جدا، أيا كان. ومن ثم لدينا ارتباط، OK؟ لذلك تذكر، وهو عبارة عن الارتباط. انها لن تذهب إلى أي مكان. ونحن في طريقنا لاعطائها الرابط الطبقة، وانا اعتقد. دعونا اعطائها class-- تعطيني فكرة. ALLISON BUCHHOLTZ والاتحاد الافريقي: بارد. TOMAS REIMERS: Coo-- دعونا ذهاب والطبقة جميلة. لماذا لا؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: OK. TOMAS REIMERS: حتى الأمور في نصابها الصحيح الآن جميلة ذاهبون لجعل الخلفية الأزرق، لون الخلفية من سمك السلمون. أن من المنطقي. واذا لم نفعل this-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: هل تريد إضافة نص حتى الارتباط التشعبي يظهر في الواقع يصل؟ TOMAS REIMERS: هذا ستكون الكلمة الطيبة. ALLISON BUCHHOLTZ-AU: 'السبب الحق نحن الآن ستعمل مجرد الحصول على شيء. TOMAS REIMERS: لذلك هذا هو الرابط. "هذا هو الارتباط." أوه، وهذا هو الذهاب أن يكون ارتباط آخر. دعونا إعطائها الطبقة "بارد". أنت على حق. باردة. حتى الآن نحن ذاهبون الى الاستيلاء على هذه. ونحن في طريقنا لرمي واحد. لدينا واحدة في العلامة الخاصة، ونحن أيضا ستكون لدينا واحدة في العلامة جميلة. والآن ما نحن في طريقنا ل القيام به هو أننا ذاهبون لجعل cool-- ماذا نريد أن نفعل؟ ALLISON BUCHHOLTZ والاتحاد الافريقي: يمكننا جعله أكبر؟ TOMAS REIMERS: دعونا إعطائها الحدود. ALLISON BUCHHOLTZ والاتحاد الافريقي: ويمكننا أن الحدود. TOMAS REIMERS: نعم. لذلك نحن ذاهبون للقيام بشيء مثل، is-- الحدود ونحن ذاهب الى شرح كل هذا في الثانية. في الوقت الراهن-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: إلى نموذج الصندوق. TOMAS REIMERS: ولكن في الوقت الراهن، ونحن مجرد الذهاب لاعطائها الحدود. وذلك ما يعنيه ذلك هو أنت الذهاب لرؤية هذه الروابط. وأنت تسير لمعرفة أن لديهم هذه، مثل، الحدود السوداء القبيحة، التي هو بارد. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: موقعنا هو جميل جدا. 

TOMAS REIMERS: نعم. موقعنا رائع. لذلك فان هذه هما صلات، وظهورها. الآن دعونا نتظاهر I يريد فقط للقيام بذلك اذا لم يكن في شيء والتي كان لها خلفية من سمك السلمون. حتى أن نتذكر أن هذا واحد لديه خلفية من سمك السلمون، لأنها من الطبقة جميلة. 

ولكننا نريد أن نقول أن يبرد فقط والتي هي في فئة خاصة، وليس في الصف جدا، يجب أن يكون لديك تلك الحدود. حسنا، ما يمكنك القيام به هو أنت يمكن القول، .special، والفضاء، .cool. وما أن يفعل، وعندما كنت تعتقد حول هذا الموضوع، غير انها تقول في الأساس، OK، تجد لي كل شيء يطابق خاص. ثم داخل تلك العلامات، وتجد لي كل ما هو بارد. ALLISON BUCHHOLTZ والاتحاد الافريقي: لذلك وسيلة أخرى التي قد تكون جيدة للتفكير في ذلك، إعادته مرة أخرى إلى C، هو تماما مثل فكرة النطاق. حتى عندما يكون لديك بعض محدد، مثل تلك التي التي كنا نعمل لقبل هذا، الصفحة الخاصة بك على شبكة الإنترنت بأكملها، كل من HTML الخاص بك ضمن النطاق الخاص بك، أليس كذلك؟ ولكن عندما يكون لدينا هذه العلاقات بين الوالدين والطفل، كما لو كنت تضييق حيث كنت تبحث لمكان معين، كما لو، مثل، نحن نبحث داخل وظيفة محددة بدلا من ذلك من الملف لدينا كامل. الجمهور: حتى مع أخذ ذلك في الاعتبار، من شأنه أنه قد يهم إذا كان لدينا changed-- ALLISON BUCHHOLTZ والاتحاد الافريقي: إن النظام؟ الجمهور: الذي يصادف فئة في CSS ل.cool، والفضاء، .special؟ ALLISON BUCHHOLTZ والاتحاد الافريقي: نعم، لأن بعد ذلك أن أن أقول، ونطاق ل كل ما لديها بارد، وبعد ذلك ننظر في ما has-- أعني، مثل، في هذه الحالة، أنا لا أعتقد أنه كان يمكن أن تغييره. 

TOMAS REIMERS: إذا كنا قد قال ماذا؟ آسف. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: إذا كنا نطاق لتبرد ثم بحث عن الأشياء من خاص، سيكون من نفسه، في الواقع. 

TOMAS REIMERS: لذلك لن يكون. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: إنه لن؟ أوه، يا جيدا. كنت مخطئا. 

TOMAS REIMERS: لذلك السبب انها different-- mistake-- شيوعا وهذا الحق الآن فقط رابط يحتوي بارد، أليس كذلك؟ أعتقد سؤالي لك هو الرجال، ما على هذه الصفحة هي يقابله .cool؟ هناك نوعان من علامات هنا، أليس كذلك؟ وهو هذا واحد وهذا واحد. كلا تطابق بارد. أي شيء آخر لا. حتى إذا قال لك، .cool، والفضاء، .special، ما كنت سأقوله هو، ضمن هذه العلامات، ما هو خاص؟ ALLISON BUCHHOLTZ والاتحاد الافريقي: جلالة الملك. هذا ما it-- الحق. لأنه وكأنه مجرد شيء هنا. 

TOMAS REIMERS: لذلك يختار شيئا. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: حيث مع خاصة، ونحن ضمن هذه العلامات هنا. 

TOMAS REIMERS: أولئك وهؤلاء. الحضور: OK. حتى تلك العلامات من الأمام مائل؟ 

TOMAS REIMERS: نعم. هل هذا يعقل؟ كيف انها في الاساس في محاولة لتضييق نطاق. ALLISON BUCHHOLTZ والاتحاد الافريقي: نعم. أعتقد أن هذا هو على الارجح أسهل طريقة للتفكير في الامر. 

TOMAS REIMERS: هكذا وجدنا هذا، و وجدنا هذا كل من يقابل الخاصة. ثم نطلبه، ضمن هؤلاء الرجال، ما هو بارد؟ وضمن هذه واحدة، بارد هذا واحد. ضمن هذه واحدة، لا شيء بارد. لذلك هذا هو العلامة الوحيدة التي لا يزال قائما. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: بارد في حين هو فقط داخل هذه العلامات وهناك. TOMAS REIMERS: بالضبط. وما هو خاص داخل تلك؟ لا شيء. الآن، ما سأقوله هو إذا كان هناك أي مساحة، كنت طالبا ما هو بارد وspecial-- أو ما هو جميل والخاصة، أليس كذلك؟ إذا أنت تقول .special.pretty، وهذا نفس .pretty.special. 

لأن ما هو إزالة الفضاء يسأل هو، عندما تقول .special، كنت طالبا، OK، تلك التي هي خاصة؟ ثم تلك التي تلك هي أيضا جميلة، والذي هو نفسه، نحويا، كما يسأل، ما هو جميل، ثم من هؤلاء، ما هو خاص أيضا؟ أليس كذلك؟ إنه الفرق من ما هو ضمن ما هو. الحضور: OK. TOMAS REIMERS: نعم. رائع. حتى مع أخذ ذلك في الاعتبار then-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: أعتقد أن لدينا آخر الشيء هو (في الهوى BRITISH ACCENT) نموذج الصندوق. 

TOMAS REIMERS: إن [يضحك] box-- أحب الطريقة التي تقول أليسون ذلك. ذلك الشيء نموذج الصندوق. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: لدينا فقط مربع، وسوف يكون نموذج الصندوق الخاص بك. TOMAS REIMERS: لذلك دعونا نتحدث عن ذلك. حتى الآن لقد قضى الكثير من الوقت في الحديث عن محددات. الآن، يا رفاق هي على الارجح، مثل، سادة selectors-- تعلمون، كيفية اختيار بالضبط المحتوى الذي تريد التلاعب على الشاشة. 

وحتى الآن فإن السؤال هو، كيف بالضبط يمكنك معالجة ذلك؟ لذا أعتقد أبسط الطريق الى التفكير في ذلك هو، أيضا، ما بالضبط هو عنصر في CSS؟ لقد قضينا الكثير من الوقت نتحدث عن، ما هو علامة، أو ما هو أبسط تمثيل علامة؟ 

وهناك طريقة جيدة للتفكير وهذا هو، ما هو شكل سمك السلمون؟ ما هو شكل، مثل، سمك السلمون اللون الخلفية؟ 

الجمهور: إنها المستطيل. 

TOMAS REIMERS: انها مستطيل، أليس كذلك؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: لم يكن السؤال خدعة. [ضحك] 

TOMAS REIMERS: لا تحاول لخداع يا رفاق هذا في وقت متأخر. لذلك لدينا هذا المستطيل. والعلامة هي ص، أليس كذلك؟ حتى يعطينا خير الاعتقاد بأن الفقرة تتمثل مستطيل، في الأقل في ذهن المتصفح، والتي هو عليه. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: أعني، المتصفحات وعادة ما تكون مستطيلة الشكل، لذلك فمن المنطقي. 

TOMAS REIMERS: الفكرة هنا هي أن جميع العلامات ضمن CSS يتم تمثيل كما مستطيل. وكل مستطيل أربعة أجزاء وفقا لCSS، OK؟ لديك المحتوى الفعلي. هذا هو أين يكمن النص. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: ربما صورتك. 

TOMAS REIMERS: نعم. لديك الحشو، وهو مجرد نوع من المساحة البيضاء. ثم لديك الحدود. ثم لديك الهامش، الذي هو المساحة البيضاء خارج ذلك. بحيث لا معنى له إلى أي شخص، لذلك نحن سنتحدث عن ذلك لفترة ثانية. حتى هنا، ما نحن في طريقنا للقيام ونحن في طريقنا لخلق بعض DIVS، OK؟ إسمح لي بينما I-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: أشعر علينا أن نضع صورة لطيف في. 

TOMAS REIMERS: نحن بالتأكيد ينبغي. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: أشعر الجميع يمكن أن تستفيد من الصورة لطيف، هو كل شيء. 

TOMAS REIMERS: هل نحن جميع الاستفادة من a-- 

الجمهور: نعم، بالتأكيد. TOMAS REIMERS: OK، بارد. لذا يجب أن نضع لطيف صورة في مكان ما. ALLISON BUCHHOLTZ والاتحاد الافريقي: أشعر وكأنني قد يكون أرنب لطيف مفيد في الوقت الراهن. TOMAS REIMERS: بالتأكيد. ALLISON BUCHHOLTZ والاتحاد الافريقي: نهاية الأسبوع. لديك شيء adorab-- 

TOMAS REIMERS: كيف نوبة هريرة؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: تعمل A هريرة أيضا. 

TOMAS REIMERS: بارد، ل هناك موقع لذلك. انه دعا PlaceKitten. ALLISON BUCHHOLTZ والاتحاد الافريقي: هذا أمر عظيم. TOMAS REIMERS: نعم. ALLISON BUCHHOLTZ والاتحاد الافريقي: فقط ل، مثل، الصور نائبا في موقع الويب الخاص بك. TOMAS REIMERS: مم-HM. هناك أيضا PlacePuppy. وهناك PlaceBacon. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: PlaceBacon؟ حقا؟ 

TOMAS REIMERS: أوه، ونحن لا الحصول الإنترنت هنا. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: [آهات] مأساوية. TOMAS REIMERS: خلاف ذلك، وأود أن تظهر لك الرجال كيفية وضع الصور في موقع الويب الخاص بك. ونحن في طريقنا لمحاولة الحصول على هذا العمل من قبل لدينا للذهاب. لكنه الآن، نحن فقط سنتحدث في الألوان ثم. نحن نريد ان نضع صور kittens-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: فعلنا. 

TOMAS REIMERS: الذي يصادف الإنترنت أسفل لحظة الحاضر. لذلك لدينا اثنين من DIVS، ونحن الذهاب لمنحهم هويات اثنين. ونحن في طريقنا إلى نسميها "الأولى" و "الثانية". لذا معرف = "لأول مرة". ونحن في طريقنا لمنحهم اثنين من الألوان. إذا كيف نختار شيئا مع معرف "الأول"؟ ALLISON BUCHHOLTZ والاتحاد الافريقي: نقطة أو التجزئة؟ الجمهور: حاد. TOMAS REIMERS: شارب، والكمال. شارب، تجزئة، مهما we-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: الكثير من الأشياء للإتصال به. 

TOMAS REIMERS: OK. ونحن في طريقنا إلى تسوية على الوسم، و هذا ما نحن في طريقنا للذهاب معها. موافق؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: الوسم. 

TOMAS REIMERS: حتى الوسم أولا. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: لذلك يمكنك تغرد على seminar-- CSS الوسم، هاشتاج بارد. TOMAS REIMERS: الوسم الذهول. ALLISON BUCHHOLTZ والاتحاد الافريقي: هاشتاج الذهول، نعم. TOMAS REIMERS: OK. لذلك لدينا "الأولى" و "الثانية". أولا بذلك، ونحن في طريقنا لديك لون خلفية حمراء. ALLISON BUCHHOLTZ والاتحاد الافريقي: آه، القولون. TOMAS REIMERS: نعم. ALLISON BUCHHOLTZ والاتحاد الافريقي: سوف يكون لديك بقعة المدقق. TOMAS REIMERS: أليسون حصل لي. لون الخلفية من blue-- 

TOMAS REIMERS: البنفسجي! 

TOMAS REIMERS: الأرجواني. ALLISON BUCHHOLTZ والاتحاد الافريقي: نعم. بلدي اللون الأرجواني المفضل، ونحن لم تستخدم حتى الآن. 

TOMAS REIMERS: البنفسج. ALLISON BUCHHOLTZ والاتحاد الافريقي: البنفسج. أن يعمل. 

TOMAS REIMERS: لذلك نحن ستكون لدينا اثنين من DIVS. انهم ذاهبون لتكون فارغة تماما. ربما ينبغي لنا أن لديهم بعض النص. حتى "الأول" ستكون "مرحبا". و "الثانية" سوف say-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: وداعا. 

الجمهور: - "العالم". مرحبا، وداعا. ALLISON BUCHHOLTZ والاتحاد الافريقي: رأيت لهم في الحفل الأسبوع الأخرى. TOMAS REIMERS: البيتلز؟ ALLISON BUCHHOLTZ والاتحاد الافريقي: لريال. انهم ليست كبيرة. أنا لا أحب ذلك. 

TOMAS REIMERS: لدينا "مرحبا" و "وداعا". ومرة أخرى، CSS هو مجرد رهيبة، لأنه يعترف الألوان لدينا. لا تحتاج حتى ل يشعرون بالقلق من ان وجدت. يفعلون. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: وجدت. 

TOMAS REIMERS: لذا CSS أعتقد ديه 255 الكلمات للحديث عن اللون. إذا كنت تستطيع التفكير في اللون خارج تلك 255، مثل، وسوف يكون أعجب. ALLISON BUCHHOLTZ والاتحاد الافريقي: نعم. أعتقد أنه قد يكون يا رفاق تأتي فقط في الحق بعد. 

TOMAS REIMERS: حتى هنا، سترى لدينا اثنين من صناديق الحق على رأس كل منهما الآخر، أليس كذلك؟ مرحبا وداعا. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: ليس هناك مساحة بين بين. انهم smooshed فقط الحق على رأس كل منهما الآخر. 

TOMAS REIMERS: لذا فإن أول شيء أعتقد أننا يجب أن نتحدث عن غير دعونا say-- أيضا نعم. حتى CSS يمثل لهم كنوع من الصناديق. ومربعات، لديهم المحتوى. ومضمون الآن هو نوع من ومرحبا أو وداعا وهذا كل شيء. موافق؟ 

حتى واحد من أول الأشياء لك يمكن القيام به هو أن تتمكن من إضافة الحشو. يقول الحشو الفضاء كم يجب أن تترك على كل جانب. لذلك دعونا نقول أريد أن أقول 10 بكسل على كل جانب. وأنا لن تشريح أنه في ثانية واحدة. ALLISON BUCHHOLTZ والاتحاد الافريقي: كل هذه الأمور هنا ستكون معظمها في بكسل بالنسبة لبقية الندوة. وأنت تسير أن نرى أن لديها بعض المساحة حوله، أليس كذلك؟ وذلك ما لم تشاهد هنا وهناك هذا النوع من الحشو غير مرئية على كل جانب، والتي تقول، مثل، OK، لديك مربع بك من content-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: هل تريد لسحب فقط حتى تفقد عنصر؟ 

TOMAS REIMERS: نعم، وهذا هو فكرة جيدة. ALLISON BUCHHOLTZ والاتحاد الافريقي: أيضا، أجد أن تفقد عنصر هو وسيلة جيدة لمعرفة إذا كان هناك شيء يحدث خطأ، يحدث شيء غير متوقع، فحص العلامات ورؤية ما انها مثل الكتابة فوق غير مفيدة. 

TOMAS REIMERS: لذلك أنا لست متأكدا إذا يا رفاق يمكن أن يرى هذا اللون. يمكن لك؟ سترى هذا الحشو على هذا النوع من الحافة. ومن ثم ترى الفعلية المحتوى باللون الأزرق، أليس كذلك؟ لذلك هذا هو جدا أساسيات نموذج الصندوق. لديك محتوى. ثم لديك الحشو. 

الجمهور: لماذا لا تقوم فقط استخدام مربع داخل the-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: الحق. لأنه اختيار فقط العنصر في الوقت الحالي. 

TOMAS REIMERS: نعم. أمور أخرى. لذلك دعونا نتحدث عن ذلك قيادة الحشو لثانية واحدة. حتى في CSS، والقياسات الحاجة إلى وجود وحدة. لذلك أولا لديك المبلغ. حتى في هذه الحالة، قلنا 10. ثم واحدة المقبل قلنا هو بكسل، بكسل. تلك الأخرى قد تكون لديكم هي أشياء مثل سم، بوصة. يمكنك أن تفعل أشياء مثل، ما هو 10 بوصة؟ وأنه سيكون مثير للسخرية. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: أوه، الصبي. 

الجمهور: قف. 

TOMAS وALLISON: نعم. TOMAS REIMERS: ولهذا كل الحشو. انا ذاهب الى العودة الى بكسل. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: بكسل تميل إلى أن تكون، مثل، هذا المعيار. عندما تنظر في الكثير من المواقع، كانوا يعملون في الغالب في بكسل. TOMAS REIMERS: إذن أنت ذاهب لرؤية إما pixels-- تلك الأخرى ترى هو م، وهو واحد هو م مساو لارتفاع الخط الذي تستخدمه حاليا. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: مم. TOMAS REIMERS: انها طريقة جيدة لقولها، مثل، أريد الفضاء بقدر الخط بلدي هو أخذ. ALLISON BUCHHOLTZ والاتحاد الافريقي: لم أكن أعرف ذلك. تتعلم شيئا جديدا كل يوم. TOMAS REIMERS: هناك الكثير من القياسات في CS. أقترح عليك البحث عنها. لجميع الحالات الخاصة بك، وأعتقد أن وينبغي أن تكون بكسل كافية. وانهم أيضا ما وأنت تسير لرؤية في معظم الأمثلة القيام به على الانترنت. ولذا فإننا سوف نترك الامر عند بكسل. 

يمكنك أيضا، وأود أن say-- ذلك مجموعات الحشو جميع سائد. كما يمكنك أن تفعل شيئا من هذا القبيل "الحشو أعلى" لمجرد set-- ALLISON BUCHHOLTZ والاتحاد الافريقي: ربما أننا سنصل لدينا "مرحبا" إلى الخلف. TOMAS REIMERS: --to فقط تعيين الحشو على رأس ولا شيء غير ذلك. لذا الأوامر الأربعة هي الحشو أعلى، الحشو من أسفل، يسار الحشو، والحشو اليمين. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: تماما مثل تتوقعون لمربع. 

TOMAS REIMERS: نعم. لا شيء مجنونة جدا هناك. هل هذا يعقل؟ حتى لا يكون الحشو. انا ذاهب الى تعيين كافة وسائد إلى 10. ثم انا ذاهب للانتقال إلى الحدود. 

فما هي الحدود هو الحدود أمر غريب. فإنه يأخذ نوعا من ثلاثة أشياء في وقت واحد. حتى الأول هو كيف كبيرة لك تريد أن تكون بمثابة القياس. مرة أخرى، أنا فقط باستخدام بكسل. وآخر شيء أنا ينبغي أن نضيف لقياسات هو الشيء الوحيد الذي لا تحتاج وحدة هو 0. انها في الواقع غير صحيح لإعطاء 0 وحدة، لأن 0 هو 0 عبر بوصة، بكسل، سم، أيا كان. كل ذلك يعني فقط 0، أليس كذلك؟ ذلك لأول مرة كنت تعطيه القياس. 

ثم تعطيه النمط. لذلك أنا ذاهب الى القول "صلبة". وسوف نتحدث عن ما يعنيه ذلك. ثم أخيرا، كنت تعطيه اللون. لذلك أنا ذاهب الى القول "الأسود". وهذه كلها أشياء قمنا الآن تشاهد من قبل، باستثناء النمط، ولكن سوف نتحدث عن ذلك. لذلك يا رفاق شهدت القياسات، وكنت قد رأيت الألوان. وما يحدث هو نحصل على هذا الحدود السوداء لطيفة حوله، أليس كذلك؟ يا رفاق نرى كيف فعلنا ذلك؟ 

الجمهور: نعم. 

TOMAS REIMERS: بارد. لذلك ما هو؟ لذلك أولا وقبل كل، انها بكسل واحد. هذا بديهي بما فيه الكفاية، أليس كذلك؟ مثل، انها بكسل واحد سميك. أو أنه سيكون من بكسل واحد، ولكن أنا التكبير، لذلك هو أكثر من ذلك قليلا من ذلك. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: ولدينا هذا القرار TV مثير للسخرية. 

TOMAS REIMERS: نعم. يمكنك جعلها أكبر، أصغر، أيا كان. وحتى هنا في الحدود يومين بكسل. سترى انها ضعف سميكة. الشيء التالي الذي يكون هو اللون. هذا ليس مثيرة للاهتمام. أنا لست بصدد الحديث حول ذلك، حقا. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: ولكن النمط قد يكون قليلا مثيرة للاهتمام. 

TOMAS REIMERS: نعم. لذلك النمط، هناك عدد قليل منها أن أرى شائعة الاستخدام. الصلبة، واحد المقبلة أول واحد منقط، وانطلق الماضي واحد. وهنا تنتشر. سترى انهم حفنة من النقاط، أليس كذلك؟ وهناك طريقة جيدة لنوع من الحصول على الحدود لطيفة الذهاب، شرطات هي أيضا شعبي جدا. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: وبعد ذلك بالطبع، وأنا متأكد من أن هناك الكثير غيرها الأنماط التي يمكنك الحصول عليها. ولدينا مجموعة كبيرة من الروابط في نهاية ليا رفاق إلى نوع من الاطلاع و ننظر CSS أكثر باردة. 

TOMAS REIMERS: وبعد ذلك آخر شيء، ونحن الذهاب إلى الحديث عن نماذج مربع حقيقية سريعة. أوه، ثم الحدود، تماما مثل الحشو، لديك أيضا أشياء مثل الحدود اليسار، واليمين الحدود، الحدود بين كبار، الحدود من القاعدة، والتي تسمح لك للحصول على الحدود محدد. حتى هنا فقط الحد الأيسر تعريف. هل هذا منطقي؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: انها باردة الطريق إلى التأكيد على الأشياء أو إضافة الخطوط الفاصلة بين العناصر المختلفة. TOMAS REIMERS: بالتأكيد. ذلك أن حدودنا. وهامش الماضي واحد. مثل الحشو هامش ل إلا انها ليست within-- ALLISON BUCHHOLTZ والاتحاد الافريقي: انها لا حول العنصر الخاص بك ولكن في الواقع حول كامل المربع الذي كنا رؤية. 

TOMAS REIMERS: نعم. وقال أليسون ذلك تماما. انها ليست، مثل، داخل بك عنصر، انها في جميع أنحاء مربع كامل. وهذا يعني أشياء مثل الخلفية لا تنطبق عليه. وتقول في الأساس، مثل، أنا لا أريد أي شيء في هذا الفضاء الكثير بالنسبة لي. لذلك مثل لدينا هنا هامش 10 بكسل. لذلك لا شيء في غضون 10 بكسل يجب أن تكون بجانبي. هذا النوع من لها الفضاء ولكن نوع من لا. لذلك هذا هو جدا أساسيات نموذج الصندوق. هل هذا يعقل؟ بارد، بارد. ALLISON BUCHHOLTZ والاتحاد الافريقي: ممتاز. وحتى الآن أعتقد أننا فقط لدينا موارد باردة أننا سوف يأخذك الرجال من خلال بسرعة كبيرة. وسنقوم actually-- جيدا، هل لدينا الإنترنت حتى الآن؟ 

TOMAS REIMERS: دعونا نرى ما اذا كان يمكنني فتح up-- اسمحوا لي أن أرى إن كنت يمكن الحصول على الإنترنت بسرعة في حين أليسون يتحدث عن أي شيء أليسون يريد الحديث عنه. ALLISON BUCHHOLTZ والاتحاد الافريقي: basically-- لذلك أنا لا أعرف ماذا يمكنني أن أقول في هذه المرحلة. ولكن هذه هي بعض موارد جيدة حقا. هذه هي تلك التي توماس ولقد استخدمت وأننا في الواقع تستخدم لالإعدادية لهذا الغرض. W3Schools واحد هو أن لك الرجال يجب أن شهدت من قبل. نحن أوصى به ل الكثير من الأشياء مع CSS. وأنا أعلم أنني أوصي به قسم بلدي في كل وقت. 

واحدة من الأشياء العظيمة هو أنه يسمح لك نوع من الفوضى مع CSS ونرى التغييرات على الفور في هذا، مثل، وعرض مزدوج النافذة التي لديه. لذلك لم يكن لديك ما يدعو للقلق إنشاء صفحة الويب الخاصة بك، أو إقامة عشقتك في الخاص الأجهزة المحلية والمضيف المحلي، والحصول على كل ما عمل الاشياء. تم تضمين هذا الحق داخل الصفحة. 

ولها هذه القليل الدروس التي يمكنك من خلال الذهاب للتعلم المزيد عن محددات، أو تعلم حول معالجة الخاص بك الخط، أو خلفية أو صورة. وكان لديك هذه نتائج فورية أنك لم يكن لديك للقيام بأي العمل الإعدادية آخر ل. لذلك أنا أحب W3Schools. انها رائع. هل تعمل؟ 

TOMAS REIMERS: نعم. لا، انها ليست. هل تريد مني أن محاولة وإعادة تشغيل جهاز الكمبيوتر الخاص بي؟ أو نريد علي: 

ALLISON BUCHHOLTZ والاتحاد الافريقي: أعني، حسنا، هذا سيكون أيضا على الانترنت. سوف كافة الشرائح تكون على الانترنت. لذلك أنا فقط أوصي به هذه. 

هذا شيء عظيم كما فقط مثل ورقة الغش. انها مجرد جميع الأساسية أوامر التي لديك. انه لشيء رائع عندما كنت لأول مرة بدءا من موقع الويب الخاص بك. لأنه ربما كنت لا نريد ان نصل الى جميع في نيتي الحقيقي شجاع تصميم الثقيلة الاشياء. تحتاج فقط إلى تهيئته بطريقة هذا النوع من المنطقي والإرادة القيام في الوقت الراهن. وإذا كنت تريد حقا للوصول الى ذلك، وأنا أعلم وهذا هو، مثل، واحدة من المراجع المفضلة لتوماس ل. كنا استخدامه ل الإعدادية، وانها رائع. انها مطور من موزيلا. 

TOMAS REIMERS: لذا موزيلا هي الناس الذين جعل فايرفوكس. وانها مجرد مطور الخاصة بهم المرجعية، التي اعتقد انها رهيبة. ولها رائع قائمة الموارد. لذلك نحن have-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: ثم ملاحظة أخيرة هي عندما كنت في محاولة ل تصميم موقع الويب الخاص بك، الاستلهام من الأشياء التي تظن أنها جميلة. تفقد عنصر، تفتيش شفرة المصدر يمكن أن تكون مفيدة السوبر لفي محاولة لمعرفة كيفية أسلوب موقع الويب الخاص بك. 

في كثير من الأحيان، وأنا أشعر بأن أفضل الطريق، بالإضافة إلى التجريب، هو مجرد للنظر في الأشياء التي هي جميلة. أجد أنه من الصعب حقا لمجرد نوع من تصميم الأشياء بنفسك، خصوصا في البداية. لذا يرجى إلقاء نظرة على المواقع أن تستمتع تبحث في. معرفة ما الذي يجعل منهم جذابة لك. ومن ثم لا تتردد في محاولة لتكرار ذلك. 

TOMAS REIMERS: الحق. حتى مثل المواقع مثل هذا، يمكنك أن ترى هناك بالتأكيد شعبة في الأعلى. ثم لديك آخر div داخل هنا، وهو CSS الذهول. ثم لديك مجموعة من الروابط هنا. إذا كنت حقا مجرد تفتيش العناصر، يمكنك فرز لل تبدأ في رؤية ما يفعله المواقع تبدو وكأنها، وكيف يمكنني إعادة أنه إذا أردت. هل هذا يعقل؟ لذلك ليس لدينا سوى ثلاث دقائق من نهاية المباراة. من الأسئلة؟ أي واحد منهم؟ نعم. 

الجمهور: للون مستطيل، كيف have-- إذا لم ترغب في ذلك الذهاب عبر صفحة كاملة، يمكن كنت قد جعلت من الذهاب عبر فقط نصف صفحة أو مجرد النص؟ 

TOMAS REIMERS: نعم، بالتأكيد. لذلك اسمحوا لي أن نرى في الواقع. I لديه فكرتين. أولا حتى من كل شيء، كنت يمكن أيضا استخدام النسب المئوية. 

الجمهور: حقا؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: لذلك شيئا للبحث عن المواقع غير نسبي. إنه شيء نحن لم يكن لديك الوقت للوصول الى، ولكن هذا شيء أنا بالتأكيد ننصح الرجال التدقيق بها. 

TOMAS REIMERS: النسب المئوية ذلك. ونرى كيف جعل من 50٪ فقط من العرض؟ ALLISON BUCHHOLTZ والاتحاد الافريقي: إذا كنت نعرف في الواقع عدد البكسل، يمكنك أن تكون أكثر دقة بهذه الطريقة. يمكنك كمان مع حولها. ولكن 50٪. إذا كان لنا أن تغيير حجم المتصفح لدينا، سيكون جعله أصغر. 

TOMAS REIMERS: حسنا، انها الآن أساسا 50٪ الحق، على ما أعتقد. انها 50٪، ثم الهامش قد أضيفت إلى ذلك. CSS لديها الكثير من المراوغات. حتى الآن وهذا هو 50٪ من عرض الصفحة. ولكن تذكر أن لديك 10 بكسل اقلعت من كل جانب. حتى لو كنت لنقل تلك ضد الحافة اليسرى للمتصفح، ثم أنها تبدو مثل 50٪. مرة أخرى، كما قلت، يمكن CSS يكون هناك الكثير من التخمين والاختيار. مثل، وكنت تعتقد شيئا ما الذهاب إلى التصرف اتجاه واحد، ولكنه يتصرف بطريقة مختلفة تماما. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: وكنت مجرد الحصول على أكثر ذكاء، وكنت مجرد الحصول على أفضل الحدس لذلك وأنت تتحرك على طول. 

TOMAS REIMERS: وذلك يحصل أسوأ وأسوأ. ذلك انها حقا مجرد سباق. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: هذا السوبر مشجعة. نريد منهم أن مثل CSS. 

TOMAS REIMERS: CSS رائع. تذكر ذلك. أسئلة أخرى؟ 

ALLISON BUCHHOLTZ والاتحاد الافريقي: شيء واحد. أي شيء آخر؟ باردة. 

TOMAS REIMERS: ممتاز. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: حسنا، إذا كنت رفاق لديك أي أسئلة في وقت لاحق، نحن دائما جاهزون حسب المعتاد. وربما كنت سوف نرى بعض من بنا للحصول على المشاريع النهائية وبالتأكيد في هاكاثون. 

TOMAS REIMERS: بالتأكيد. وخلال المعرض. 

ALLISON BUCHHOLTZ والاتحاد الافريقي: وفي المعرض. أوه. 

TOMAS REIMERS: نتطلع ل رؤية كل من awesome-- الخاص بك 

ALLISON BUCHHOLTZ والاتحاد الافريقي: سنرى جميع المواقع رهيبة بك التي من شأنها أن تكون جميلة. TOMAS REIMERS: يمكنك دائما ترى، مثل والمواقع الذي كان، مثل، CSS جيدا ثم مثل أولئك الذين لم تحاول أن تفعل CSS. ALLISON BUCHHOLTZ والاتحاد الافريقي: أيضا، وآخر الشيء، أكثر شيء واحد للنظر في هو إلباس الحذاء. حتى التمهيد شيء عظيم. 

TOMAS REIMERS: جوجل أنه إذا you-- 

ALLISON BUCHHOLTZ والاتحاد الافريقي: جوجل انها. انها رائع. سوف تحب ذلك. والآن بعد أن لديك فهم أساسي من CSS، انها سوف تجعل الكثير من معانيها. رائع. شكرا، الرجال. 

TOMAS REIMERS: شكرا جزيلا لك.