شیوه نامه (css) چیست؟ چگونه از css در وردپرس استفاده کنیم؟

شیوه نامه (css) یا شیوه‌نامه آبشاری (Cascading Style Sheet) یک زبان نشانه گذاری برای تعریف جلوه های تصویری و قالب بندی اسناد HTML می باشد. پوسته های وردپرس از CSS و HTML برای خروجی گرفتن از اطلاعاتی که توسط وردپرس تولید می شوند استفاده می کنند. هر قالب وردپرسی دارای یک فایل style.css می باشد. این فایل سی اس اس حاوی قوانینی برای تعریف قالب بندی صفحاتی که توسط وردپرس ایجاد می شوند است.

یادگیری و استفاده از زبان نشانه گذاری CSS بسیار راحت می باشد. سایت های زیادی به زبان انگلیسی و فارسی وجود دارند که آموزش های CSS را منتشر می کنند, این آموزش ها می توانند به یک تازه کار وردپرس برای شروع کار کمک کند. البته به دلیل اینکه CSS خیلی راحت می باشد بسیاری از کاربران وردپرس با کمی نگاه کردن به فایل style.css می توانند اصول اولیه این زبان را درک کنند.

مثال:

body { 
font-size:12px;
color: #000;
background-color:#fff; 
} 

h1 { 
font-size:18px;
text-transform:none;
}

.post-title { 
font-size: 16px; 
color: #000;
font-weight:normal;
} 

عناصر HTML می توانند به صورت مستقیم توسط css استایل داده شوند. همچنین طراحان وب می توانند با استفاده از شناسه ها (ID) و کلاس ها (classes) بخش های مختلفی که که می خواهند استایل دهند را تعریف کنند. این قابلیت به آنها کمک می کند تا از استایل های مختلف برای عنصار یکسان HTML در یک صفحه اما در بخش های مختلف استفاده کنند. برای مثال, یک عنصر H1 در سربرگ یک صفحه می تواند متفاوت از عنصر H1 واقع در ناحیه پست همان صفحه استایل داده شود.

مثال:

<div id="header">

<h1 class="blog-title">
<a href="<?php bloginfo('url'); ?>" title="<?php bloginfo('name'); ?>"><?php bloginfo('name'); ?></a>
</h1>

</div>

سند HTML ای که در بالا می بینید شامل یک id به نام header و یک کلاس به نام blog-title می باشد. این بخش ها می توانند به صورت مجزا مانند زیر توسط CSS استایل داده شوند.

#header { 
background-color:#000;
height:140px;
width:100%;
padding:20px 10px; 
} 

h1.blog-title a { 
font-color:#000; 
font-size:15px;
font-family: tahoma; 
text-decoration:none;
} 

کاربر گرامی برای ارسال دیدگاه اگر عضو روکش هستید باید سایت شوید در غیر اینصورت باید عضو شوید.