1
00:00:00,630 --> 00:00:05,120
इस वीडियो में हम खरोंच से इस फोटोग्राफर के पोर्टफोलियो साइट बनाने के लिए जा रहे हैं।

2
00:00:05,310 --> 00:00:11,550
और आमतौर पर मैं अपने दम पर ऐसा करते हैं और फिर आप एक समाधान वीडियो इस निम्नलिखित देने के लिए प्रयास करने के लिए आप से पूछना होगा।

3
00:00:11,640 --> 00:00:14,050
हालांकि इस बार यह एक विचार कोड के साथ है।

4
00:00:14,070 --> 00:00:20,650
इसलिए मैं आप के साथ कोड के लिए प्रयास करने के लिए और अगर आप पसंद करते हैं आप इसे एक बार के माध्यम से कोड अगले समय के साथ देखते हैं और फिर कर सकते हैं करना चाहते हैं।

5
00:00:20,850 --> 00:00:26,940
लेकिन यहाँ लक्ष्य है कि हम यह एक साथ करने जा रहे हैं और वहाँ दो अन्य बातें हम इस से बाहर निकलना चाहते हैं कि कर रहे हैं।

6
00:00:26,940 --> 00:00:37,190
पहले एक वहाँ एक नया संपत्ति है मैं नाव बुलाया दिखाने के लिए जा रहा हूँ और दूसरी बात मैं तो बस आप थोड़ा सा अनुभव के निर्माण के लिए कुछ है कि आप में से कुछ हद तक गर्व किया जा सकता प्राप्त करना चाहते है।

7
00:00:37,200 --> 00:00:43,160
यह एक छोटा सा साधारण चीजें हैं जो सिर्फ सच उज्ज्वल भयंकर रंग है कि हम इतनी दूर किया है कर रहे हैं की तुलना में कुछ बेहतर लग रहा है।

8
00:00:43,170 --> 00:00:47,210
तो यह वास्तव में एक न्यूनतम फोटो ब्लॉग है कि हम क्या करने जा रहे है।

9
00:00:47,280 --> 00:00:49,160
तो चलो शुरू हो जाओ।

10
00:00:49,230 --> 00:00:50,610
उदात्त खोलो।

11
00:00:50,880 --> 00:00:54,330
मुझे लगता है कि HMO फोटो ग्रिड नामक एक एकल फाइल की है।

12
00:00:54,960 --> 00:01:00,480
मैं पहली बार आप छवि या कुछ और है कि हम साथ काम कर रहे हैं दिखाने के लिए जा रहा हूँ।

13
00:01:00,480 --> 00:01:08,390
तो इन छवियों को नौ छवियों तीन अलग-अलग फोटोग्राफरों कि मैं फ़्लिकर पर पाया से तीन छवियों प्रत्येक रहे हैं।

14
00:01:08,700 --> 00:01:10,920
सभी तस्वीरें क्रिएटिव कॉमन्स के अंतर्गत लाइसेंस प्राप्त कर रहे हैं।

15
00:01:10,920 --> 00:01:13,030
आप यहाँ लाइसेंस कर सकते हैं।

16
00:01:13,050 --> 00:01:46,750
तो इससे पहले कि हम इन छवि आप यूआरएल मैं वास्तव में उनमें से छुटकारा पाने के लिए जा रहा हूँ और मैं फोटो ब्लॉग में मेरी आयु वर्ग के कंकाल विज्ञापन दीन में जोड़ने के लिए जा रहा हूँ और मैं आप ऐसा डॉन एक त्वरित प्रदर्शन करने जा रहा हूँ के साथ कुछ भी 'टी जब मैं एक है कि हैलो कहते हैं, और एक है कि अलविदा कहते divs को जोड़ने के इस भाग के साथ-साथ कोड के लिए है और मैं उन्हें बचाने के लिए जा रहा हूँ और फिर मैं अपने स्टाइलशीट जिसमें मैं की तस्वीरें बुला रहा हूँ जोड़ने के लिए जा रहा हूँ एसएस और फिर यहाँ पर मैं अपने divs शैली के लिए जा रहा हूँ।

17
00:01:46,770 --> 00:01:53,890
इसलिए मैं वास्तव में उन्हें एक आई.डी. देने जा रहा हूँ बस इसे एक कहते हैं।

18
00:01:54,270 --> 00:02:27,630
और फिर यह सिर्फ यहाँ पर एक करने के लिए कुछ और फिर प्रदर्शित करने के लिए है मैं एक और दो का चयन करने के लिए जा रहा हूँ और सभी मैं क्या करने जा रहा हूँ बस उन्हें एक अलग पृष्ठभूमि रंग लाल और फिर पृष्ठभूमि रंग बैंगनी दे रहा है और उसके बाद मैं हूँ उन दोनों के सभी divs और 100 पिक्सल के एक चौड़ाई देने के लिए जा रहा है।

19
00:02:27,630 --> 00:02:32,430
इसलिए मैं यह ब्राउज़र में खोलने के लिए जब मैं यह कर।

20
00:02:33,540 --> 00:02:36,970
हम दो divs एक के बाद एक लोगों की है।

21
00:02:36,990 --> 00:02:39,020
याद रखें कि अगर हम निरीक्षण किया वे।

22
00:02:39,480 --> 00:02:44,280
वे मूल रूप से स्थापित कर रहे हैं, ताकि वे अपनी लाइन को अपने ब्लॉक स्तर तत्व ले।

23
00:02:44,280 --> 00:02:54,490
तो अगर मुझे लगता है कि ऐसा करने के लिए जो है हम छवि ग्रिड हम अपनी छवियों को एक ग्रिड या एकाधिक एक ही लाइन पर हैं फार्म के लिए चाहते हैं के लिए क्या करने जा रहे हैं क्या नहीं करना चाहती।

24
00:02:54,540 --> 00:03:01,690
और अगर ऐसा है, तो मुझे लगता है कि divs के साथ मैं एक संपत्ति नाव कहा जाता है का उपयोग करने की जरूरत है या कि एक ही रास्ता है कि मैं इसे पूरा कर सकते हैं करना चाहते हैं।

25
00:03:01,740 --> 00:03:06,780
यहाँ तो सब मुझे करना सुरक्षित नाव को छोड़ दिया और कहा कि क्या करेंगे।

26
00:03:06,780 --> 00:03:11,390
यह दस्तावेज़ के सामान्य प्रवाह से बाहर तत्वों सभी divs ले जाएगा।

27
00:03:11,580 --> 00:03:14,730
तो वहाँ अलग तर्ज पर प्रत्येक पर वर्तमान में ढेर कर रहे हैं।

28
00:03:15,000 --> 00:03:23,090
और क्या होगा कि वे बाईं ओर जारी करेगी गुरुत्वाकर्षण लगभग हमारे दस्तावेज़ में दूर जा के रूप में यह सोचने के लिए है।

29
00:03:23,280 --> 00:03:26,380
और इसलिए इस div नाव और बाईं ओर पुश करने के लिए जा रहा है।

30
00:03:26,400 --> 00:03:27,580
इस एक के खिलाफ।

31
00:03:27,990 --> 00:03:32,200
तो अगर मैं यहाँ ताजा थे आप देखेंगे कि वे एक ही लाइन पर अब कर रहे हैं देख सकते हैं।

32
00:03:32,280 --> 00:03:41,840
इसलिए हम जब हम छवियों का उपयोग कर रहे हैं इस सिद्धांत का उपयोग करने के लिए इतना है कि हम प्राप्त छवियों मूल रूप से एक दूसरे के खिलाफ ऊपर जाना है और एक ग्रिड के रूप में कर सकते हैं जा रहे हैं।

33
00:03:41,970 --> 00:03:49,910
इसलिए मुझे लगता है और अब इस सब से छुटकारा पाने के लिए और डिवाइस है कि हम से छुटकारा पाने के लिए जा रहा हूँ मैं इस तरह से हमारी छवि में जोड़ने के लिए जा रहा हूँ।

34
00:03:50,280 --> 00:03:57,040
इसलिए मैं इस पूर्ण स्क्रीन बनाने के लिए जा रहा हूँ और इन छवि लिंक है कि उस फ़ाइल को इस वीडियो के साथ शामिल कर रहे हैं में सिर्फ पेस्ट करें।

35
00:03:57,810 --> 00:04:08,230
और नहीं बल्कि यह है, जहां मैं एक छवि टैग बनाने के लिए और फिर चारों ओर आप कॉपी और नौ बार जो बहुत ही धीमी गति से होना चाहिए में पेस्ट की तरह नौ छवि टैग बनाने की तुलना में।

36
00:04:08,490 --> 00:04:22,730
मैं यहाँ उदात्त जादू का एक छोटा सा प्रयोग करने के लिए जहां मैं हर लाइन की शुरुआत का चयन करने के आदेश पर क्लिक उपयोग कर रहा हूँ जा रहा हूँ और फिर मैं सिर्फ छवि स्रोत के बराबर होती है टाइप करने के लिए और फिर लाइन के अंत में जाने के लिए जा रहा हूँ।

37
00:04:22,800 --> 00:04:35,380
तो मैं एक आदेश सही तीर कमान छोड़ दिया तीर कमान शुरुआत करने के लिए इसे लेता है सही अंत करने के लिए चला जाता है और फिर मैं बोली और फिर समापन वर्ग के साथ खत्म करने के लिए जा रहा हूँ इस्तेमाल किया।

38
00:04:35,400 --> 00:04:40,550
तो यह है कि एक बहुत आसान और त्वरित तरीका है उन सभी के आप छवि टैग के रूप में कल्पित हैं लगा देना था।

39
00:04:40,920 --> 00:04:46,340
तो अगर मैं इस बचा है और वे ब्राउज़र को जाने के लिए आप जब मैं ताज़ा देखेंगे।

40
00:04:46,530 --> 00:04:47,960
अब हम नौ छवियों है।

41
00:04:48,090 --> 00:04:49,680
बेशक एकीकृत नहीं कर रहे हैं।

42
00:04:49,890 --> 00:04:53,890
वे अंतरिक्ष के एक बहुत ऊपर ले जा रहे हैं।

43
00:04:54,060 --> 00:05:01,230
तो क्या अब हम क्या करने जा रहे हैं हमारी शैली पत्रक के लिए जाने के लिए और सभी छवियों का चयन करें।

44
00:05:01,230 --> 00:05:05,520
और पहली बात यह है कि हम शायद यहाँ क्या करना चाहते हैं बस उन्हें दूर दे रहा है।

45
00:05:06,090 --> 00:05:13,280
तो चलो शुरू करने के लिए 100 की तरह पिक्सल के साथ उन्हें एक देते हैं और इस तरह से बहुत छोटा होने जा रहा है।

46
00:05:13,710 --> 00:05:26,360
लेकिन मैं आप देखेंगे क्या होता है और ताज़ा करने के लिए करना चाहते हैं और तुम नोटिस हूँ कि इन सभी छवियों को अब एक साथ एक लाइन में हैं, लेकिन उनके बीच कुछ रिक्ति है कि हम निर्दिष्ट नहीं किया है कि।

47
00:05:26,430 --> 00:05:29,780
हम मार्जिन या गद्दी या कुछ भी सेट कभी नहीं।

48
00:05:29,790 --> 00:05:36,040
तो क्या हो रहा है वहाँ वास्तव में कुछ सफेद स्थान है कि कहा जा रहा है कि है और यह एक भाप उल्लू में एक विचित्र बात का एक छोटा सा है।

49
00:05:36,050 --> 00:05:42,870
लेकिन हम कुछ और बिना छवियों है जब वहाँ एक सफेद स्थान या सिर्फ एक ही जगह है कि इन के बीच कहा है।

50
00:05:43,140 --> 00:05:51,540
हम इस बात का छुटकारा चाहते हैं तो अगर हम नाव का उपयोग करें और याद है कि नाव दस्तावेज़ के प्रवाह की बातें बाहर ले जाएगा।

51
00:05:51,570 --> 00:05:59,800
तो अगर मैं अब ताज़ा आप देख सकते हैं छवियों रहे हैं कि एक दूसरे के खिलाफ butting और वहाँ मूल रूप से कोई अंतरिक्ष उन दोनों के बीच में सब है।

52
00:06:00,150 --> 00:06:04,120
और फिर हम वापस जाने के लिए और हमारे आत्म में है कि अंतरिक्ष में जोड़ सकते हैं।

53
00:06:04,170 --> 00:06:07,020
इसलिए हम स्पष्ट रूप से उन्हें इस छोटी सी जगह लेने के लिए नहीं करना चाहती।

54
00:06:07,020 --> 00:06:13,700
हम तीन के पार जा रहा है और हम उन दोनों के बीच कुछ मार्जिन चाहते करना चाहते हैं लेकिन हम उस पर नियंत्रण करना चाहते हैं।

55
00:06:14,160 --> 00:06:27,320
इसलिए उन्हें अस्थायी द्वारा हम सफेद अंतरिक्ष से छुटकारा मिल गया है कि ब्राउज़र हमारे लिए इतना कहा है कि अब हम वास्तविक खाली स्थान के बजाय मार्जिन संपत्ति का उपयोग कर अपने स्वयं के कस्टम दूरी पर जा सकते हैं।

56
00:06:28,920 --> 00:06:33,670
तो अब हम चौड़ाई बदलने के लिए और 30 प्रतिशत के साथ शुरू करते जा रहे हैं।

57
00:06:33,720 --> 00:06:39,180
तो याद है कि इसराइल प्रतिशत शरीर की मूल तत्वों के सापेक्ष है।

58
00:06:39,180 --> 00:06:41,910
तो हर एक के शरीर का 30 प्रतिशत तक ले जाएगा।

59
00:06:41,910 --> 00:06:46,830
और कारण है कि मैं 30 के साथ शुरू कर रहा हूँ यकीन है कि वे सभी एक लाइन या कि तीन फिट पर फिट बनाने के लिए ही है।

60
00:06:46,830 --> 00:06:52,120
मेरे मन में और आप देखेंगे कि हम उनमें से तीन को पाने के बीच कोई अंतरिक्ष में जा रहा देखेंगे।

61
00:06:52,260 --> 00:06:58,370
और फिर हम, क्योंकि यह केवल 90 प्रतिशत है कि हम ले जा रहे है यहाँ पर हमारे 10 प्रतिशत की है।

62
00:06:58,470 --> 00:07:06,790
इसलिए हम चाहते हैं कि अन्य प्रतिशत का उपयोग करने के लिए वास्तव में मार्जिन अलग और उन दोनों के बीच कुछ रिक्ति जोड़ने के लिए जा रहे हैं।

63
00:07:07,020 --> 00:07:09,460
तो पहले से ही हम एक ग्रिड तीन तीन से की है।

64
00:07:09,650 --> 00:07:12,550
क्या हम आगे क्या करना चाहते हैं यह इस तरह लग रहे बनाने के लिए है।

65
00:07:12,750 --> 00:07:15,000
या फिर हम भी उन दोनों के बीच रिक्ति है।

66
00:07:15,180 --> 00:07:17,870
इसलिए हम वास्तव में गणित का एक छोटा सा क्या करना है।

67
00:07:18,060 --> 00:07:18,860
तो मैं पहले से ही यह किया है।

68
00:07:18,870 --> 00:07:26,210
लेकिन बुनियादी तौर पर अगर हम इस गणना वहाँ एक मार्जिन यहाँ वहाँ एक मार्जिन यहाँ भी है।

69
00:07:26,570 --> 00:07:28,430
वहाँ एक मार्जिन यहाँ तीन है।

70
00:07:28,600 --> 00:07:32,400
और फिर इस एक से पांच पर उसके लिए यह एक पर।

71
00:07:32,670 --> 00:07:34,910
और यह एक या एक से छह पर।

72
00:07:34,920 --> 00:07:45,570
इसलिए हम 10 प्रतिशत है और हम विभाजित करने के लिए है कि 6 से 10 और छह से विभाजित एक बिंदु छह छह की जरूरत है।

73
00:07:45,570 --> 00:07:52,810
तो क्या हम क्या करने जा रहे है सिर्फ मार्जिन एक बिंदु छह छह प्रतिशत का कहना है।

74
00:07:52,950 --> 00:08:01,900
तो अगर हम ब्राउज़र को वापस जाने के लिए और परिणाम की जाँच करें और ताज़ा आप देखेंगे कि हम उन दोनों के बीच अंतर के साथ तीन समान रूप से स्थान छवियों को मिलता है।

75
00:08:01,950 --> 00:08:04,850
तो गणित सिर्फ इतना है कि एक बार और मारा।

76
00:08:05,070 --> 00:08:06,570
इनमें से हर एक को 10 प्रतिशत है।

77
00:08:06,570 --> 00:08:07,980
इसलिए वे सिर्फ 30 प्रतिशत दे।

78
00:08:08,160 --> 00:08:12,370
और हर एक के दोनों तरफ 1.6 प्रतिशत का मार्जिन है।

79
00:08:12,390 --> 00:08:22,920
इसलिए हम दोनों पक्षों को छोड़ दिया और सही एक बिंदु छह बार दो प्लस 30 प्रतिशत लेते हैं और हम इनमें से हर एक के लिए तैंतीस बिंदु तीन प्रतिशत मिलता है।

80
00:08:22,920 --> 00:08:29,330
तो यह है कि एक तिहाई बिल्कुल या लगभग वैसा हम इकट्ठा कर रहे हैं, लेकिन सबसे अच्छा है कि हम यहाँ कर सकते है।

81
00:08:29,530 --> 00:08:30,800
तो तैंतीस बिंदु तीन प्रतिशत।

82
00:08:30,810 --> 00:08:35,200
इनमें से प्रत्येक एक ही हम उस को सत्यापित करने के लिए बस का निरीक्षण कर सकते हैं।

83
00:08:35,670 --> 00:08:36,670
हम वहाँ चलें।