Kesan CSS: sudut bulat unsur-unsur

Sintaks Cascading Style Sheets direka supaya hanya bahawa kemungkinan mendapatkan reka bentuk yang paling tidak dijangka boleh didapati walaupun jauh dari pengaturcaraan dan pembangunan laman manusia. Mungkin hakikat bahawa kanak-kanak bermain dengan blok kekal dalam ingatan semua orang, menggunakan pengalaman yang pelbagai dalam HTML, CSS mudah.

Walau bagaimanapun, program semasa masih sangat jauh dari menyampaikan pembinaan realiti. Sehingga kini, mana-mana kawasan (diduduki apa yang anda suka elemen besar) dalam apa-apa makna dan pelantikan rasmi bentuk segi empat tepat, yang terbentuk dalam kawasan garis lengkung kontur yang dikehendaki.

Sehingga kini, mana-mana bulatan, pembundaran radius, bagaimana lurus melengkung dan sebagainya. P. Menerangkan persamaan kompleks matematik atau kiub sangat kecil, trapezium, segi tiga atau unsur-unsur lelurus lain yang dibezakan dengan mata sebagai titik pada baris.

reka bentuk lurus klasik

Ia tidak menghairankan bahawa kemajuan dalam bidang pengaturcaraan dan teknologi maklumat sisi undang-undang reka bentuk segi empat tepat. idea-idea inovatif tidak membuang masa kepada bentuk yang bulat, tetapi jangan lupa untuk hadir pada pelupusan ciri-ciri pemaju cukup dan tag HTML peraturan, CSS dan bahasa pengaturcaraan yang berkaitan.

Apa-apa unsur yang digunakan dalam laman ini adalah kawasan segi empat tepat, di mana ia diperuntukkan beberapa bahagian, yang mana dalam setiap kes harus digunakan hanya perlu mempertimbangkan keperluan krossbrauzernosti ciri markup kandungan tertentu ada pembinaan sintaksis.

Peraturan am untuk CSS

Cascading Style Sheets menawarkan untuk menggambarkan unsur-unsur seperti berikut:

• harta: nilai.

Dalam kes ini, harta - nama tertentu dan nilai boleh sama ada nama atau senarai nama atau nilai-nilai.

Mengenai unsur-unsur blok dan keperluan untuk melakukan melalui CSS sudut bulat, ia masuk akal untuk menggunakan harta border-radius dan nilai dalam format "38px" atau "8px 16px 24px 38px".

Jika nilai yang diberikan oleh beberapa tunggal, ia akan ditetapkan untuk orang-orang untuk semua sudut. Rekod keempat-empat nilai adalah:

• Nombor pertama - untuk sudut kiri atas;
• kedua - ke kanan atas;
• ketiga - untuk kanan bawah;
• terkini - ke kiri lebih rendah.

Berkongsi beberapa peraturan

Konsep sempadan, imej dan latar belakang boleh digunakan bersama-sama. Ini adalah perkara biasa, dan disebut peraturan tidak mengganggu antara satu sama lain, membentuk komposisi keseluruhan. Perkara utama - untuk mengambil kira hakikat bahawa nama setiap daripada mereka mewakili, dan bagaimana ia digunakan.

Sebelum melaksanakan ini atau elemen itu, ia adalah penting untuk menjalankan beberapa eksperimen dan kerja ujian pada pelbagai pelayar. Orientasi kepada nasihat, cadangan, contoh pihak ketiga atau CSS sintaks, sudut bulat, dan sebagainya. N. Apakah jarang lebih baik daripada amalan segar mereka sendiri.

Ia adalah penting untuk memahami bahawa sempadan, imej, dari segi sudut reka bentuk - jenis yang sama konsep. Lukisan boleh tidak dibentangkan dalam png-format. Dia akan disingkirkan oleh pelayar, mengikut peraturan yang ditetapkan dalam CSS. sudut bulat - pemaju yang prihatin, tanpa mengira squareness bahan sumber.

Ciri-ciri HTML, CSS dari pelayar

Selamat datang borong rakaman Style - untuk semua pelayar sekaligus. Anyway contoh klasik mengenai topik "CSS: sudut bulat" tawaran untuk menulis demikian:

background: # FF7F00; / * Latar Belakang * /

border: 1px #CCCCCC pepejal; / * Border * /

-moz-border-radius: 10px; / * CSS sudut bulat untuk Mozilla Firefox * /

-webkit-border-radius: 10px; / * ... untuk Safari dan Chrome * /

-khtml-border-radius: 10px; / * ... Konquerer * /

border-radius: 10px; / * CSS The sudut bulat untuk semua * / dan sebagainya. N.

Walau bagaimanapun, dalam kebanyakan kes ia sudah cukup untuk menentukan peraturan lalu. Redundancy hanya perlu digunakan apabila terdapat keperluan sebenar.

meja klasik dan indah

Walaupun banyak kontroversi penyokong susun atur meja (tr, td) dan pilihan untuk menggunakan tag div dan span ( «menakjubkan" layout), amalan objektif disukai pilihan semunasabahnya perlu.

Dalam divs mempunyai beberapa maruah dalam jadual lain. Jika mereka tidak melengkapi antara satu sama lain, dan hanya bersaing, soalan akan cepat tersejat dalam satu versi yang menggabungkan aspek terbaik meja dan divs.

Kebanyakan laman web yang dicipta menggunakan CMS (sistem pengurusan kandungan), dan dalam pelupusan pemaju datang bukan sahaja pelbagai dataset "gergasi" ratusan folder, objek, tetapi juga jadual.

Tag [div | span], oleh itu, tidak menonjol, tetapi satu-satunya perkara yang datang tepat pada rahmat lengkap pemaju - helaian gaya CSS. Dan mana-mana CMS jelas memisahkan kod, sebahagian daripadanya dari kreativiti pemaju dan gaya mereka sendiri gaya ditambah, dan dalam kes perubahan (contohnya, css - pembundaran sudut meja), anda sentiasa boleh memulihkan tetapan dan gaya lalai.

Lengkung dan sudut yang tidak dilindungi oleh sintaks

Anda dilarang sama juga berpegang dengan semua peraturan HTML, CSS, tetapi mempunyai Akibatnya, mereka tidak disediakan. Menindih elemen antara satu sama lain, ia adalah mungkin untuk mendapatkan mana-mana kawasan sebarang konfigurasi. Menggunakan PHP-pembangunan pada pelayan, anda boleh menghantar kepada pelayar pelawat dan apa-apa fail gaya untuk melampirkan kepada mereka kod JavaScript yang sesuai dalam tubuh HTML-fail atau berasingan js-fail.

Mana-mana varian litar, sebarang bentuk unsur harta adalah peraturan CSS! sudut bulat - semata-mata tertentu, dan peluang pekerjaan sebenar adalah lebih luas. Dalam kes ini, pengaturcaraan objek anda sendiri, anda boleh tidak memberi perhatian kepada ciri-ciri pelayar individu, hanya menggunakan tag dan struktur bahasa hiperteks, yang dianggap oleh semua, tanpa pelayar terkecuali.

Menggunakan idea pengaturcaraan berorientasikan objek, anda boleh mereka bentuk rupa sudut atau lengkung jelas tidak diramalkan oleh mana-mana bentuk pelayar. Dalam kes ini, ia tidak perlu bahawa ini akan menjadi sudut kawasan itu, yang pada asalnya adalah suatu bentuk segi empat tepat. Ia adalah penting bahawa komponen keluk yang diterangkan dalam bentuk peraturan CSS, digabungkan ke dalam visual JavaScript kod objek tunggal dan pada masa yang tepat dalam pelayar tempat yang betul, mencerminkan dirinya dalam bentuk yang betul.

Teknologi ini tidak mengganggu objek tersebut untuk mewujudkan diri mereka dalam kapal terbang atau rancangan animasi tiga dimensi.