logo

Լրացուցիչ Բլոկների Տեսակներ (EBT) - Դասավորության Կառուցողի նոր փորձառություն❗

Լրացուցիչ Բլոկների Տեսակներ (EBT) - ձևավորված, կարգավորելի բլոկների տեսակներ՝ սլայդշոուներ, ներդիրներ, քարտեր, բացվող ցանկեր և շատ ուրիշներ։ Ներառված կարգավորումներ՝ ֆոնի, DOM տուփի, JavaScript փլագինների համար։ Փորձեք դասավորությունների կառուցման ապագան արդեն այսօր։

EBT մոդուլների ցուցադրական տարբերակներ Ներբեռնել EBT մոդուլները

❗Լրացուցիչ Պարբերությունների Տեսակներ (EPT) - Պարբերությունների նոր փորձառություն

Լրացուցիչ պարբերության տեսակներ (EPT) - անալոգիական պարբերության վրա հիմնված մոդուլների հավաքակազմ։

EPT մոդուլների ցուցադրական տարբերակներ Ներբեռնել EPT մոդուլները

Scroll
  1. Սկիզբ
  2. Articles

CSS ձեռնարկ — Դաս 1 — CSS ոճերի միացում

10/05/2025, by Ivan

Ես չեմ բացատրելու, թե ինչի համար է CSS-ը ծառայող: Եթե բացել եք այս ձեռնարկը, նշանակում է՝ ցանկանում եք սովորել այն: Ապրեմ ասել, որ CSS-ի հնարավորությունները շատ լայն են և թույլ են տալիս համալիր մառկետներ сверстать ցանկացած դժվարության: CSS-ի կիրառմամբ պետք է հրաժարվել size, color, bgcolor, align եւ այլ HTML կարգավորիչներից, որոնք խանգարում են CSS-ին:

Գոնե երեք եղանակ կա CSS-ը HTML ֆայլին միացնելու: Նախ՝ ամենապարզը, հետո՝ երկրորդ, և առավել ճիշտ երրորդ եղանակը:

CSS-ը տեգի ներսում (<element style="...">)

CSS կարելի է ավելացնել style պատկանելիքով:

<div style="width: 200px; height: 100px;">
  Բլոկ
</div>

Այսպիսով, ստեղծում ենք 200×100 պիքսել չափի բլոկ: CSS-ն գրելով style="..." մեջ, շարունակում ենք նույնմիջոց syntax-ին՝

style="փարամետր: արժեք;փարամետր: արժեք;..."

CSS ֆայլի մեջ, HTML-ի <head>-ում (<style> թեգ)

Այս կերպ մենք թեք CSS-ը տեղադրում ենք HTML ֆայլի վերևում, <head>-ում՝

<html>
  <head>
    <title>CSS ձեռնարկ</title>
    <style type="text/css">
      /* այստեղ գրել CSS */
    </style>
  </head>
  <body>
    <p>Ուսումնասիրեք CSS-ը drupalbook.org-ով</p>
    <p>2-րդ տող. Ուսումնասիրեք CSS drupalbook.org-ով</p>
  </body>
</html>

օրինակ CSS կոդ.

<html>
  <head>
    <title>CSS ձեռնարկ</title>
    <style type="text/css">
      body {
        background: #eeeeee; /* էջի ֆոնը */
        font-size: 14px;     /* տառաչափի չափը */
      }
      p {
        color: #ff0000; /* տեքստի գույնը */
      }
    </style>
  </head>
  <body>
    <p>Ուսումնասիրեք CSS drupalbook.org-ով</p>
    <p>2-րդ տող. Ուսումնասիրեք CSS drupalbook.org-ով</p>
  </body>
</html>

CSS առանձին ֆայլում (<link> թեգ)

Սա լավագույն եղանակն է, որը թույլ է տալիս ամբողջությամբ բաժանել CSS-ը HTML-ից: Չարժի լցնել CSS-ը HTML-ի մեջ՝ փոխարենը պետք է առանձին ֆայլ ստեղծել և միացնել նրան---

<html>
  <head>
    <title>CSS ձեռնարկ</title>
    <link type="text/css" rel="stylesheet" media="all" href="style.css" />
  </head>
  <body>
    <p>Ուսումնասիրեք CSS drupalbook.org-ով</p>
    <p>2-րդ տող. Ուսումնասիրեք CSS drupalbook.org-ով</p>
  </body>
</html>

link թեգի այլատրիբուտները՝

  • type="text/css" — CSS տեսակը,
  • rel="stylesheet" — արտահայտում է, որ սա ոճային թերթիկ է,
  • media="all" — կիրառվում է բոլոր սարքավորումների համար,
  • href="style.css" — CSS ֆայլի ուղին (հարաբերական).

Եղանակը պետք է լինի այսպիսին. ստեղծեք style.css ֆայլ HTML-ի կողքին և դրեք CSS կոդը.

body {
  background: #eeeeee; /* էջի ֆոնը */
  font-size: 14px;     /* տառաչափի չափը */
}
p {
  color: #ff0000; /* տեքստի գույնը */
}

Պահպանեք ֆայլերը և թարմացրեք զննիչը: Այժմ CSS-ը միացված է առանձին ֆայլով և պատրաստ ենք հաջորդ պարապմունքին՝ ավելի խորքային CSS ուսումնասիրությանը: