CSS Box: ექსპრომტი და ეფექტი

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

ნებისმიერი ვიზუალური tag HTML მარკირების - მართკუთხედის ფართობი კონკრეტული სტრუქტურა და შინაარსი. ელემენტს მოიცავს მითითებით კოორდინატები, ზომა, padding, ფერის, შრიფტის, შრიფტის სტილი, და სხვ. Frame CSS ელემენტს განსაზღვრავს მათ ოკუპირებულ ტერიტორიაზე, რომელიც მდებარეობს შინაგანი მისი საზღვრების დანიშნული აქ სიგანე.

სინტაქსი აღწერა

FIELD განთავსება ელემენტს განსაზღვრული კოორდინატები ნათესავი ზედა მარცხენა კუთხეში გვერდზე (მარცხენა, ზედა), ზომა ჰორიზონტალური და ვერტიკალური მიმართულებით (სიგანე, სიმაღლე). ყველა დიზაინი და ანიმაცია ელემენტები მზადდება წყვილი "ქონება: ღირებულება".

აღწერა კეთდება პირდაპირ გვერდზე ჩასასმელი კოდი სტილის ან ცალკე ფაილი, მიუთითებს, რომ მას LINK მითითება. სინტაქსი:

#name {ქონება: ღირებულება; ქონება: ღირებულება; ქონება: ღირებულება; ...}

ან

.სახელი {ქონება: ღირებულება; ქონება: ღირებულება; ქონება: ღირებულება; ...}

სახელი ასევე შეიძლება p, ორგანო, html, მაგიდა, td ..., რომ არის სახელი HTML-markup აქვს. შეიძლება უშუალოდ დაკავშირებულია აღწერა სტილი ელემენტს.

სანამ შეადგინოს საკუთარი წერის სტილი, არ დაშავებულა ვხედავ, როგორ კეთდება პოპულარულ საიტებზე, შენახვა გვერდი კოდი, ან დაჭერით Ctrl-U ჩაირთოს პირდაპირ ბრაუზერში.

ძირითადი პარამეტრები

სინამდვილეში CSS ფარგლებში ელემენტს წარმოადგენდა სტილი (სასაზღვრო სტილის), ფერადი (სასაზღვრო-ფერის), სიგანე (სასაზღვრო-სიგანე). ეს შესაძლებელია შეაჯამა ერთ ქონება - საზღვარზე. თქვენ შეგიძლიათ აღწერს თითოეული ჩარჩო საზღვრის დამოუკიდებლად (სასაზღვრო-top, სასაზღვრო-ქვედა, სასაზღვრო-მარცხენა, სასაზღვრო-მარჯვნივ).

CSS ჩარჩო აღწერილი ზოგადი წესები კასკადური სტილების:

border: 3px;
საზღვრის ფერი: წითელი;
სასაზღვრო-style: ორმაგი დატეხილი მყარი dotted.

ეს აღწერილობა ადგენს საზღვრის სიგანე 3 pixels, ფერი - წითელი, სტილი მხარეს: ზედა მხარეს ორმაგი, მარჯვნივ - დატეხილი, მყარი ქვედა, მარცხენა - წერტილი.

სასაზღვრო-width: 1px 2px 4px 8px;
საზღვრის ფერი: ლურჯი;
სასაზღვრო-style: მოფენილი.

აქ, ზომები თითოეული მხარე ასევე თანამიმდევრულად ზედა, ისრის, ფერი - ლურჯი, და სტილი - Spot.

საზღვრის ფერი: ლურჯი წითელი მწვანე შავი;

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

border: 1px მწვანე მყარი;
სასაზღვრო-რადიუსი: 0px 4px 8px 12px;
-moz სასაზღვრო-რადიუსი: 0px 4px 8px 12px;
-webkit სასაზღვრო-რადიუსი: 0px 4px 8px 12px;

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

სისქე ჩარჩო და მისი მიზანი

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

თუ ძირითად ჩარჩოს კლასის დაკეტილია, რომ არ არის, სასურველი მას ფსევდო-კლასი: hover, ეს შეიძლება იყოს ნაჩვენები სტუმარი გვერდი ელემენტს, როდესაც ეს კურსორი, როგორიცაა ხაზს უსვამს პუნქტს. ზოგჯერ აუცილებელია აირჩიოთ რაიმე დაჭერით იმიჯი, ან გადაიტანეთ რაღაც სადღაც. ეს არის ძალიან მოსახერხებელი dot ჩარჩო, და არ შეიცვალოს ელემენტის ფონზე ან მის შინაარსს.

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

გარეთ ქვეშ

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

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

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