ably ably برای هدایت شدن به سایت جدید اینجا کلیک کنید

آموزش برنامه نویسی

آموزش برنامه نویسی وب، اندروید، ویندوز , اسکیوال و...
Tell: 0912 097 5516
| Email: Hello@EduOnline.ir

۵ مطلب با کلمه‌ی کلیدی «CSS» ثبت شده است

چطور می توان یک استایل CSS اختصاصی برای IE نوشت

بسم الله الرحمن الرحیم

حتما شما نیز با کاربرانی که به دلیل آشنا نبودن به مرورگرهای دیگر، از مرورگر قدرتمند IE استفاده می کنند در وب سایت داشته، دارید و خواهید داشت!
خوب به دلیل مشکل کاربران در عدم استفاده از ابزار بهتر شما مجبور هستید که سایت خود را به نحوی برای کاربرانتان تغییر دهید که بتوانند آن را به خوبی مشاهده کنند:
 
لطفا مقاله "طراحی وب سایت برای مرورگرهای مختلف" را مطالعه کنید.

چطور می توان یک استایل CSS اختصاصی برای IE نوشت؟ Cross-Browser

برای این کار می توانید از روشهای زیر استفاده کنید:
در روش اول کافی است درون تگ head مانند تمامی link هایی که قرار می دهید تگ مربوط به لود کردن استایل IE را نیز قرار دهید اما با چند ویژگی، که می توانید تعیین کنید این استایل برای چه نسخه ای از مرورگر IE است.
شما می توانید با دستور IF تعیین کنید که این استایل فقط برای مرورگرهای IE مورد استفاده قرار گیرد
در دستور IF می توانید از شرطهای منطقی استفاده کنید:

  • ! به معنی not است. مثال !IE یعنی برای IE استفاده نشود.
  • gt به معنی greater than (بزرگتر از)
  • gte به معنی greater than or equal (بزرگتر مساوی)
  • lt به معنی less than (کوچکتر از)
  • lte به معنی less than or equal (کوچکتر مساوی)

ادامه مطلب...

طراحی یک جدول HTML

بسم الله الرحمن الرحیم

طبیعتا همه با طراحی یک جدول ساده HTML آشنایی دارید، مثلا جدول زیر را در نظر بگیرید:

<table >
        <tr>
            <th >
            Title
            </th>
       
            <th >
            Price
            </th>
        </tr>
         <tr>
            <td >
            CSS
            </td>
       
            <td >
            1,000,000
            </td>
        </tr>
         <tr>
            <td >
            HTML
            </td>
       
            <td >
            12,000,000
            </td>
        </tr>
</table>

خوب حالا فکر کنید می خواهید به سطرهای جدولتان استایلی بدهید، در زمان های گذشته شما می بایست یک استایل تعریف می کردید مثلا

<style>
.blueColor
{
    color:blue;
}
</style>

بعد آن را به سلول های جدول خود یعنی td  می دادید.

اما باز طبیعتا شما نیز از Selector های HTML  استفاده می کنید مثل زیر

<html>
<head>
<style>
tr
{
    color:blue;
}
</style>

</head>
<body>
<table >
        <tr>
            <th >
            Title
            </th>
       
            <th >
            Price
            </th>
        </tr>
         <tr>
            <td >
            CSS
            </td>
       
            <td >
            1,000,000
            </td>
        </tr>
         <tr>
            <td >
            HTML
            </td>
       
            <td >
            12,000,000
            </td>
        </tr>
</table>
</body>

خوب اگر بخواهید برای سطر و ستون های زوج فرد استایل تعریف کنید یک راه این است که به صورت گذشته آن را به سلول ها بدهید.

اما می توانید این کار را نیز با استفاده از jQuery  انجام دهید یعنی فقط شما استایل خود را تعریف کنید و سپس با استفاده از jQuery  استایل خود را به تمامی سلول ها بدهید.

وقتی دارید به صورت داینامیک جدول ایجاد می کنید و یا سطر و ستون های شما به صورت داینامیک از پایگاه داده شما خوانده و ایجاد می شوند، این دستور می تواند بسیار به شما کمک کند.

$(document).ready(function(){
  $("tr:odd").css("background-color","yellow");
});
</script>

حال مثال ما به صورت زیر کامل می شود

<html>
<head>
<style>
.oddStyle
{
    color:blue;
}
.evenStyle
{
    color: red;
}
</style>
<script>
    $(document).ready(function () {
        $("tr:even").addClass("even");
         $("tr:odd").addClass("oddStyle");
    });
</script>
</head>
<body>
<table >
        <tr>
            <th >
            Title
            </th>
       
            <th >
            Price
            </th>
        </tr>
         <tr>
            <td >
            CSS
            </td>
       
            <td >
            1,000,000
            </td>
        </tr>
         <tr>
            <td >
            HTML
            </td>
       
            <td >
            12,000,000
            </td>
        </tr>
</table>
</body>

شاید راه های ساده به نظر پیش پا افتاده و مبتدی باشند اما رفع یک نیاز می تواند اختراع یک دکمه باشد، سعی کنید این مطالب کوچک و پیش پا افتاده را برای افزایش سرعت کد نویسی و حل مسائل همیشه دنبال کنید

موفق باشید

آدرس دهی در HTML

بسم الله الرحمن الرحیم

در طراحی وب و HTML  ما چندین نوع روش آدرس دهی به فایل ها و مسیر ها داریم

آدرس دهی نسبی

<img src="../../Images/file.jpg" />

در این روش ما برای دسترسی به یک فایل باید  مسیری را طی کنیم که مثلا برای رفتن به پوشه های بالاتر از   /..   استفاده می کنیم و بدین صورت می توانیم کل وب سایت را پیمایش کنیم

آدرس دهی مطلق

<img src="http:www.EduOnline.ir/content/theme/Images/file.jpg" />

در این روش ما بر اساس ریشه اصلی و نام سایت شروع به آدرس دهی می کنیم که تکنولوژی ASP.NET , MVC  نیز به همین روش در انجین های سمت  View  خود آدرس دهی می کنند مانند زیر

<asp:image ImageUrl="~/content/theme/Images/file.jpg" />

 علامت ~ به معنای این است که باید از ریشه وب سایت جستجو برای یافتن فولدر Content انجام شود

ادامه مطلب...

طراحی یک قالب ایمیل

بسم الله الرحمن الرحیم

طراحی یک قالب ایمیل

در ابتدا یک صفحه html  ایجاد نمایید و سپس در قسمت head  صفحه مورد نظر کدهای زیر را قرار دهید

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <title>Demystifying Email Design</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
</html>

حال برای طراحی بدنه و قسمت محتوای خود می توانید به صورت زیر عمل کنید

ادامه مطلب...

آموزش Bundling

بسم الله الرحمن الرحیم

آموزش asp.net mvc

 در این بخش قصد دارم در خصوص بهینه سازی و افزایش سرعت لود صفحات وب مباحثی را بررسی نماییم.

همان طور که می دانید اگر در یک سایت شما چندین فایل داشته باشید به ازای هر فایل می بایست یک درخواست به سرور ارائه شود و فایل مربوطه بازیابی گردد و این خود باعث طولانی شدن زمان لود صفحات می گردد، راهکاری که برای این مشکل ارائه گردیده است تبدیل چندین فایل به یک فایل می باشد که این روش متاسفانه فقط برای فایل های تصویری، رایج و مورد استفاده است.

واقعا بسیاری از ما نیز، هنوز از این روش رایج استفاده نمی کنیم کافی است که تمامی آیکون ها و تصاویر با سایز کوچکی که در سایت مورد استفاده می خواهیم قرار دهیم را به یک تصویر تبدیل کنیم.

ادامه مطلب...
up
ما را در گوگل محبوب کنید