როგორ გავაკეთოთ ტორტი სქემა Excel-ში. მომრგვალებული კუთხეები რიგებისა და სვეტების დამატება

ამ სტატიაში გადავწყვიტე გითხრათ როგორ გააკეთოთ მაგიდა მომრგვალებული კუთხეებით. დარწმუნებული ვარ, თქვენ ალბათ შეგხვედრიათ მსგავსი ცხრილები ინტერნეტში სერფინგის დროს.

ზუსტად მაგ მაგიდებზე მოგიყვებით. რა თქმა უნდა, ასეთი ცხრილის დამზადება შესაძლებელია რამდენიმე გზით, ეს მეთოდი, რომლის შესახებაც მოგიყვებით, არის ყველაზე მარტივი და ყველაზე „ლამაზი“, რადგან თუ ასეთ ცხრილს სხვანაირად გააკეთებთ, მაშინ JAVA-ს შესწავლა მოგიწევთ. და დააკავშირეთ იგი CSS-თან და ამგვარად თქვენი კოდი გახდება ძალიან რთული და რთული.

ეს მეთოდი იყენებს მხოლოდ HTML-ს, მაგრამ ჩვენ მოგვიწევს სურათების შექმნა, ანუ ცხრილის კუთხეები. კუთხეების შესაქმნელად დაგვჭირდება Photoshop ან ნებისმიერი სხვა გრაფიკული პროგრამა, რომელიც მოგწონთ (თუნდაც MS Point), მაგრამ ისე, რომ თქვენ შეძლოთ მისი მართვა. ამ სტატიაში მე გეტყვით როგორ გააკეთოთ ისინი Photoshop-ში.

მოდით პირდაპირ გავაგრძელოთ ცხრილის შექმნა. ცხრილის შესაქმნელად გახსენით Dreamweaver ან ნებისმიერი სხვა HTML რედაქტორი. ჩვენ ვქმნით ახალ დოკუმენტს ან ვხსნით უკვე შექმნილ დოკუმენტს და იქ ვქმნით თავად ცხრილს 3 სტრიქონით და 2 სვეტით:

გადადით Photoshop-ში, აიღეთ Rounded Rectangle Tool და დახაზეთ მომრგვალებული მართკუთხედი და დააყენეთ დამრგვალების რადიუსი იმავეზე, რაც ჩვენ გვინდა, რომ ჰქონდეს ცხრილი, მე დავაყენე 30 პიქსელზე.

ჯერ შეაერთეთ ფონის ფენა და ფენა ოთხკუთხედის სურათთან, ამისათვის დააჭირეთ Ctrl ღილაკს ფენების პანელზე, აირჩიეთ ზედა და ქვედა ფენა და დააჭირეთ Ctrl + E.

ახლა ამ მართკუთხედიდან ჩვენ თვითონ უნდა გამოვყოთ კუთხეები, ამისთვის ავიღებთ Recatangular Marquee Tool-ს, ზედა პანელში აირჩიეთ Style: Fixed Size Width და Height ველებში, ჩაწერეთ რადიუსის მნიშვნელობები, რომლებიც თქვენ მიუთითეთ. ნაბიჯი 2. დააწკაპუნეთ სურათებზე, თქვენს წინ გამოჩნდება წერტილოვანი ხაზი, გადაიტანეთ ისე, რომ მომრგვალებული კუთხე მთლიანად მოედანზე იყოს.

დააჭირეთ Ctrl + C (დააკოპირეთ ის, რაც არის კვადრატის შიგნით, ანუ ჩვენი კუთხე) ახლა ჩვენ უნდა შევქმნათ ახალი სურათი, რათა იქ ჩასვათ ის კუთხე, რომელიც ადრე დავაკოპირეთ, გადადით: File-New...-Ok. და დაუყოვნებლივ ჩასვით ჩვენი კუთხე Ctrl + V

შექმნილ ცხრილში მეორე სტრიქონი უნდა გაერთიანდეს ერთში, რადგან იქ ტექსტი უნდა დაიწეროს.
ახლა ჩვენ ჩავსვით ჩვენი სურათები (კუთხეები) ჩვენს მაგიდაში.

ჩასმული სურათები (მარჯვნივ ქვედა და მარჯვნივ) უნდა იყოს გასწორებული მარჯვნივ.
ახლა ბოლო ნაბიჯი: თქვენ უნდა მიანიჭოთ მაგიდას ფონის ფერი, როგორც კუთხეები.

კარგი, ახლა ყველაფერი დასრულდა. ეს მეთოდი ყველაზე მარტივია. იმედი მაქვს, რომ ეს სტატია გარკვეულწილად დაგეხმარა და იმედი მაქვს, ყველაფერი ნათლად ავხსენი. Წარმატებები!

ყველას დიდი ხანია დაიღალა ტრადიციული მართკუთხა კუთხეები ვებსაიტების დიზაინში. მოდაშია მომრგვალებული კუთხეები, რომლებიც კეთდება არა გამოსახულების, არამედ სტილის მეშვეობით, რისთვისაც გამოიყენება საზღვრის რადიუსის თვისება. ამ თვისებას შეიძლება ჰქონდეს ერთი, ორი, სამი ან ოთხი მნიშვნელობები, რომლებიც გამოყოფილია სივრცით, რომელიც განსაზღვრავს ყველა კუთხის რადიუსს ან თითოეული ინდივიდუალურად.

მაგიდაზე 1 აჩვენებს მნიშვნელობების განსხვავებულ რაოდენობას და ბლოკის ტიპს, რომელიც მიიღება ამ შემთხვევაში.

კოდი აღწერა ხედი
div (საზღვრის რადიუსი: 10px;) დამრგვალების რადიუსი ყველა კუთხისთვის ერთდროულად.
div (საზღვრის რადიუსი: 0 10px;) პირველი მნიშვნელობა ადგენს ზედა მარცხენა და ქვედა მარჯვენა კუთხეების რადიუსს, მეორე მნიშვნელობა ადგენს რადიუსს ზედა მარჯვენა და ქვედა მარცხენა.
div (საზღვრის რადიუსი: 20px 10px 0;) პირველი მნიშვნელობა ადგენს ზედა მარცხენა კუთხის რადიუსს, მეორე - ორივე ზედა მარჯვენა და ქვედა მარცხენა, ხოლო მესამე მნიშვნელობა - ქვედა მარჯვენა.
div (საზღვრის რადიუსი: 20px 10px 5px 0;) თანმიმდევრულად ადგენს ზედა მარცხენა, ზედა მარჯვენა, ქვედა მარჯვენა და ქვედა მარცხენა კუთხეების რადიუსს.

მაგალითი 1 გვიჩვენებს, თუ როგორ უნდა შექმნათ ბლოკი მომრგვალებული კუთხეებით.

მაგალითი 1. ბლოკის კუთხეები

HTML5 CSS3 IE 9+ Cr Op Sa Fx

რადიუსი

მე არის I-ის ბრალდებითი საქმის დამატებითი ფორმა.


ამ მაგალითის შედეგი ნაჩვენებია ნახ. 1.

ბრინჯი. 1. ბლოკი მომრგვალებული კუთხეებით

საინტერესო ეფექტის მიღება შესაძლებელია, თუ დამრგვალების რადიუსს დააყენებთ ელემენტის სიმაღლისა და სიგანის ნახევარზე მეტს. ამ შემთხვევაში, თქვენ მიიღებთ წრეს. მაგალითი 2 გვიჩვენებს, თუ როგორ უნდა შექმნათ მრგვალი ღილაკი სურათით.

მაგალითი 2: მრგვალი ღილაკი

HTML5 CSS3 IE 9+ Cr Op Sa Fx

ღილაკი

ამ მაგალითის შედეგი ნაჩვენებია ნახ. 2.

ბრინჯი. 2. მრგვალი ღილაკი

Opera ბრაუზერში დამრგვალება