Sunday, November 26, 2017

அறிவோம் சி மொழியை-3ம் பகுதி.

இந்த பகுதியில் c மொழியில் printf() என்கின்ற output ஃபங்க்சன் எவ்வாறு உபயோகிப்பது என்றும் மேலும் \n  என்கின்ற new line escape sequence  பற்றியும் காணலாம்.
பொதுவாக printf என்பது சி மொழியில் அவுட் புட் செய்ய பயன் படுகின்றது.
உதாரணமாக
printf("welcome by Muthu karthikeyan");
என்கின்ற வரியானது பின் வரும் வெளியீட்டை அவுட்புட் செய்கின்றது.

welcome by Muthu karthikeyan

மேலும் 
printf("hai");
printf("how are you?")

என்று கொடுத்தால் அந்த நிரலானது வெளியீட்டை இரண்டு வெவ்வேறு வரிகளில் வராமல் பின் வருமாறு ஒரே வரியில் இருக்கும்.

haihow are you?

இரண்டு வெவ்வேறு வரிகளில் வேண்டுமென்றால் பின் வருமாரு '\n' என்கின்ற new line escape sequence ஆனது முதல் printf() statement-ன் இறுதியிலோ அல்லது இரண்டாவது printf() statement-ன் ஆரம்பத்திலோ இருக்க வேண்டும்.
printf("hai\n");
printf("how are you?")
 இப்பொழுது அவுட்புட் ஆனது இரண்டு வரிகளில் இருக்கும்.
hai
how are you?


கீழ் கண்ட வீடியோவில் தெளிவாக விளக்கப்பட்டுள்ளது.



நன்றி மீண்டும் அடுத்த பகுதியில் சந்திப்போம்.
முத்து கார்ர்திகேயன்,மதுரை

ads Udanz

Saturday, November 25, 2017

CSS கற்றுக் கொள்ளலாம்.—பகுதி-5.




நாம் சென்ற பகுதியிலிருந்து டெக்ஸ்ட் மற்றும் ஃபாண்ட் பற்றி பார்த்துக் கொன்டிருக்கிறோம் அதன் தொடர்ச்சி:
முதலில் font-family என்கின்ற ப்ராப்பர்ட்டி பற்றிக் காண்போம்.
எழுத்துருக்களின்(font) வடிவம் வெவ்வேறு வகையாய் நிறைய இருக்கின்றது. உதாரணத்திற்கு Times new roman, Arial, Verdana, Calibri போன்று விதவிதமாய் இருக்கின்றன. அதை தேர்வு செய்யவே font-family என்கின்ற பண்பு பயன்படுகின்றது.
உதாரணத்திற்கு பின் வரும் ஹெச்டிஎம்எல் நிரலை எடுத்துக் கொள்வோம்.
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
</style>
</head>
<body>
<P>
On the Insert tab, the galleries include items that are designed to coordinate with
 the overall look of your document. You can use these galleries to insert tables,
 headers, footers, lists, cover pages, and other document building blocks. When you
 create pictures, charts, or diagrams, they also coordinate with your current document
 look.
</p>
</body>

</html>
இதன் வெளியீடு பின் வருவது போல் இருக்கும். 



இப்போது font-family மாற்றப் போகின்றேன்.
<style>
p{
font-family:Arial;
}
</style>
இப்போது வெளியீடு:

முதல் படத்திற்கும் இரண்டாவது படத்திற்கும் வேறுபாடு இரண்டாவது படத்தில் உள்ள எழுத்துருக்கள் verdana ஸ்டைலில் இருக்கும்.
ஃபாண்ட் ஸ்டைல்(font-style)
இந்த பண்பானது எழுத்துருக்கள் நேராக இருக்க வேண்டுமா அல்லது சாய்வாக இருக்க வேண்டுமா என்பதை விவரிக்க உதவுகின்றது. Normal என்கின்ற பண்பு எழுத்துருக்களை நேராகவும் italic என்பது சாய்வாகவும் இருக்க பயன் படுகின்றது.
<style>
p{
font-family:Arial;
font-style:italic;
}
</style>
வெளியீடு:

மேலே உள்ள படத்தில் எழுத்துக்கள் சற்று சாய்வாக இருப்பதைக் காணலாம்.
ஏனென்றால் font-style என்கின்ற ப்ராப்பர்ட்டிக்கு italic என மதிப்பிருத்தப்ப்பட்டுள்ளது.
ஃபாண்ட் வெய்ட்(font-weight)
இந்த பண்பானது bold என மதிப்பிருத்தப் பட்டால் எழுத்துக்கள் தடிமனாக மாற்றப்படும். Normal என மதிப்பிருத்தப்பட்டால் மீண்டும் சாதாரணமாக மாறும்.
 <style>
p{
font-family:Arial;
font-style:italic;
font-weight:bold;
}
வெளியீடு:

ஃபாண்ட்-வேரியண்ட்.
இது Small-caps என மதிப்பிருத்தப்பட்டால் ஆங்கில ஸ்மால் கேஸ் எழுத்துக்கள் கேப்பிடல் ஆகவும் ஏற்கனவே கேப்பிடல் எழுத்தாக இருந்தவை சற்று பெரியதாகவும் இருக்கும்.
<style>
p{
font-family:Arial;
font-style:italic;
font-weight:bold;
font-variant:small-caps;
}
</style>
வெளியீடு:

ஃபான்ட் சைஸ்(font-size)
இது எழுத்துருக்களின் அளவை மாற்ற உதவுகின்றது அளவில் சிறியதாகவோ அல்லது பெரியதாகவோ மாற்ற பயன்படுகின்றது.
இதன் மதிப்புக்கள் பின் வருவனவற்றில் ஏதாவது ஒன்றாக இருக்கும்.
1.   xx-large
2.   x-large
3.   large
4.   medium
5.   small
6.   x-small
7.   xx-small
இப்போது ஃபாண்ட் அளவை xx-large ஆக மாற்றுகின்றேன்
<style>
p{
font-family:Arial;
font-style:italic;
font-weight:bold;
font-variant:small-caps;
font-size:xx-large;
}
</style>
வெளியீடு:

மேலே உள்ள படத்தில் எழுத்தின் அளவு பெரியதாக இருப்பதைக் காணலாம். ஏனென்றால் ஃபாண்ட் சைஸ் பண்பிற்கு xx-large என மதிப்ப்பிருத்தியுள்ளோம்.
லிஸ்ட் ப்ராப்பர்ட்டிகள்(list- properties)
ஹெச்டிஎம்எல்லில் அன் ஆர்டர்டு லிஸ்ட்(unordered list) ,ஆர்டர்டு  லிஸ்ட் என இரு வகையுள்ளன. இவ்ற்றில் லிஸ்ட் ஐகான் ப்ராப்பர்ட்டியாக வெவ்வேறு வகையான மதிப்புக்களைக் குறிப்பிடலாம். அதை சிஎஸ்எஸ் ஸ்டைல் ஷீட் மூலமாக எவ்வாறு மாற்றலாம் என பார்ப்போம்.
பொதுவாக  இதன் மதிப்புகள் பின்வருவன வற்றில் ஏதாவது ஒன்றாக இருக்கும்.


1.   Disk
2.   Circle
3.   Square
4.   Decimal
5.   Lower-roman
6.   Upper-roman
7.   Lower-alpha
8.   Upper-alpha
9.   None

டிஸ்க் என்கின்ற மதிப்பு இயல்பானதாகும்.
அவற்றை மதிப்புகளை மேலே உள்ள லிஸ்டில் ஏதாவது ஒன்றை மதிப்பிருத்தலாம். உதாரணத்திற்கு square என மதிப்பிருத்துகின்றேன்.
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
ul li{
list-style-type:square;
}

</style>
</head>
<body>
<ul>
<li> Apple</li>
<li>orange</li>
<li>mango</li>

</ul>
</body>

</html>
வெளியீடு:

மேலே உள்ள படத்தில் லிஸ்ட் ஐகான் சதுரமாக உள்ளதை பார்க்கவும்.
இப்பொழுது ஹெச்டிஎம்எல்லில் ஆர்டர்டு லிஸ்ட் ஆக மாற்றாமலே css மூலமாகவே அதை ஆர்டர்டு லிஸ்டாக மாற்றலாம்.
<style>
ul li{
list-style-type:upper-alpha;
}

</style>
</head>
<body>
<ul>
<li> Apple</li>
<li>orange</li>
<li>mango</li>

</ul>
</body>
வெளியீடு:

மேலே உள்ள நிரலில் ul என்கின்ற அன் ஆர்டர் லிஸ்ட் ஆகத் தான் குறிப்பிடப்பட்டுள்ளது. ஆனால் ஸ்டைல் ஷீட்டில் லிஸ்ட் ஸ்டைல் மதிப்பாக அப்பர் ஆல்பாவாக மாற்றியுள்ளோம்.அதன் மாறுபாட்டை படத்தில் காணலாம்.
லிஸ்ட்-ஸ்டைல்-இமேஜ்(list-style-image)
இப்பொழுது ஸ்டைல் ஐகானாக ஏதாவது ஒரு இமேஜைக் குறிப்பிடலாம்.
உதாரணமாக லிஸ்ட்-ஸ்டைல் –இமேஜாக ஒரு படத்தைக் குறிப்பிடுகின்றோம்.
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
ul li{
margin:15px;
list-style-image:url(tick.png);
}

</style>
</head>
<body>
<ul>
<li> Apple</li>
<li>orange</li>
<li>mango</li>

</ul>
</body>

</html>
வெளியீடு:


மேலே உள்ள படத்தில் லிஸ்ட் ஐகானாக ஒரு இமேஜ் இருப்பதைக் காணலாம். நன்றி மீண்டும் அடுத்த இதழில் சந்திப்போம்.
                                ---முத்து கார்த்திகேயன்.,மதுரை.



ads Udanz

Saturday, November 11, 2017

Asp.net பேசிக் கன்ட்ரோல் Drop Down list


இந்த வீடியோவில் டிராப்டவுன் கன்ட்ரோல்  பற்றி காண இருக்கின்றோம்.



Source code

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm9.aspx.cs" Inherits="textboxdemo.WebForm9" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
   
        <asp:DropDownList ID="DropDownList1" runat="server">
           
        </asp:DropDownList>
   
        <br />
        <br />
        <br />
        <asp:Button ID="Button1" runat="server" Text="Button" />
   
    </div>
    </form>
</body>
</html>


Script

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace textboxdemo
{
    public partial class WebForm9 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {

                ListItem maleitem = new ListItem("Male", "1");
                ListItem femaleitem = new ListItem("Female", "2");
                DropDownList1.Items.Add(maleitem);
                DropDownList1.Items.Add(femaleitem);
            }
        }
    }

}



to learn Dotnet course in Madurai area contact:9629329142.
ads Udanz

Saturday, November 4, 2017

CSS3 கற்றுக் கொள்ளலாம் பகுதி-4



டெக்ஸ்ட் பண்புகள்:

டெக்ஸ்ட் என்பது ஒரு முக்கியமான பண்பாகும். இதை எளிதாக புரிந்து கொள்ள வேண்டுமென்றால் முதலில் மைக்ரோ சாஃப்ட் வேர்டில் நாம் எவ்வாறெல்லாம் ஃபார்மட் செய்வோம் என்பதை முதலில் நிணைவு கூறுங்கள்.
ஒரு எழுத்துருவின் நிறம் மாற்றலாம். அதை வேறொரு டைப்பாக (உதாரணத்திற்கு ஃபாண்ட் ஃபேமிலி Arial-ல் இருந்து vardana ஆக மாற்றுதல்), ஃபாண்டை போல்ட் ஆக்கலாம். Italic ஆக மாற்றலாம். இது போன்று தாம் css-லும் நாம் பண்புகளை பயன் படுத்துவோம்.
சான்றாக கீழே வருமாரு ஒரு h1 டேக்கை உருவாக்கிக் கொள்வோம்.
<h1> Muthu karthikeyan</h1>
இப்பொழுது h1 டேக்கிற்கு ஸ்டைல் கொடுப்போம்.
<style>
h1{
color:blue;
}
</style>
இப்பொழுது Muthu kathikeyan என்பதன் நிறம் நீல நிறத்தில் இருக்கும்.

Letter spacing

இது ஒரு டெக்ஸ்டில் ஒரு எழுத்துக்கும் மற்றொரு எழுத்திற்கும் உள்ள இடைவெளியைக் குறிப்பிட பயன்படுகின்றது.
இந்த பண்பானது இரண்டு விதமான மதிப்புகளை கொண்டிருக்கும்.
அவையாவன:
Normal|length
Normal என்பது இயல்பான மதிப்பாகும். லெங்க்த் என்ற பாண்பிற்கு மூன்று விதமான அலகுகளில் நாம் மதிப்பு கொடுக்கலாம்.
1.   Pt
2.   Px
3.   em
சான்று:
<style>
h1{
letter-spacing:5pt;
}
</style>
Em என்பது 5em என்றால் முன்பு இருந்ததைப் போன்று ஐந்து மடங்கு பெரிதாக மாறும்.
சான்று நிரல்_1:
<html>
<head>
<style> 
 h1{
 color:blue;
 letter-spacing:5px;
 text-align:center;
 }
</style>
</head>
<Body>
<h1>Muthu karthikeyan</h1>
</body>
<html>
வெளியீடு:

.டெக்ஸ்ட் டெகரேசன்: (text-decoration)

இந்த பண்பானது டெக்ஸ்டை அடிக்கோடிடுதல், மேற்கோடிடுதல்  போன்றவற்றிற்கு பயன்படுகின்றது.
இது பின் வரும் மதிப்புகளில் ஏதாவது ஒன்றை ஏற்றுக் கொள்ளும்.
1.   None
2.   Underline
3.   Overline
4.   Line-through
சான்று நிரல்-2:
<html>
<head>
<style> 
 h1{
 color:blue;
 letter-spacing:5px;
 text-align:center;
 text-decoration:underline;
 }
 h2{
 text-align:center;
 text-decoration:overline;
 }
 h3{
 text-align:center;
 text-decoration:line-through
 }
 h4{
 text-align:center;
 text-decoration:none;
 }
</style>
</head>
<Body>
<h1>Muthu karthikeyan</h1>
<h2>I am from Madurai</h2>
<h3>I like programming</h3>
<h4> I love my job</h4>
</body>
<html>
வெளியீடு:


மேலே உள்ள நிரலில் h1 டேக்கானது underline பண்ணப் பட்டுள்ளது. H2 டேக்கானது overline பண்ணப்பட்டுள்ளது. H3 டேக்கானது line-through மூலம் அடித்துக் காட்டப்பட்டுள்ளது. H4 டேக்கானது மேற்கண்ட எதுவும் இல்லாமல் வழக்கம் போல் உள்ளது.

வெர்டிகள் அலைன்(vertical-align)

இந்த பண்பானது டெக்ஸ்டை subscript மற்றும் superscript செய்யப் பயன்படுகின்றது.
இந்த பண்பிற்கான மதிப்புகள்:
1.   Sub
2.   Super
Sub என்பது h2o என்பதில் 2 என்பது வெர்டிகல் ஆக கீழே வருகின்றதல்லவா அதை பயன்படுத்த உதவுகின்றது.
Super என்பது டெக்ஸ்ட் வெர்டிகல் ஆக மேலே வர உதவுகின்றது.

சான்று நிரல்:
<!DOCTYPE html>
<html>
<head>
<style>
i{
vertical-align:sub;
}
b{
vertical-align:super;
}
</style>

</head>
<body>  
    h<i>2</i>o<br/>
    2<b>3</b>
</body>
</html>  

வெளியீடு:




டெக்ஸ்ட் ட்ரான்ஸ்ஃபார்ம்(text-transform)

இந்த பண்பானது டெக்ஸ்டை பெரிய(uppercase) மற்றும் சிறிய  (lowercase) எழுத்தாக மாற்ற பயன்படுகின்றது.
Uppercase என்பது முற்றிலும் capital letter ஆகவும் lowercase என்பது முற்றிலும் small letter ஆகவும் மற்றும் capitalize என்பது ஒவ்வொரு வார்த்தையின் முதல் எழுத்தும் capital letter ஆகவும் பயன்படுகின்றது.
சான்று நிரல்-4:
<!DOCTYPE html>
<html>
<head>
<style>
h1{
text-transform:uppercase;
}
h2{
text-transform:lowercase;
}
h3{
text-transform:capitalize;
}
</style>

</head>
<body>     
      <h1> I am Muthu karthikeyan</h1>
      <h2> I love teaching</h2>
      <h3> I love writing and coding also</h3>
     
</body>
</html>     
வெளியீடு:
 

டெக்ஸ்ட் அலைன்:
இந்த பண்பானது டெக்ஸ்டை இடது,வலது மற்றும் மத்தியில் அலைன் செய்யப் பயன்படுகின்றது.இது பின் வரும் மதிப்புகளில் ஏதாவது ஒன்றை ஏற்கின்றது.
1.   left
2.   right
3.   center
4.   justify
இதில் justify என்பது ஒரு பாராவை இடது மற்றும் வலது இரு புறத்திலும் ஒரே போல் சீர்செய்யப்பயன்படுகின்றது.
சான்று நிரல்-5:
<!DOCTYPE html>
<html>
<head>
<style>
h1{
text-align:center;
}
h2{
text-align:left;
}
p{
text-align:justify;

}

</style>

</head>
<body>   
     <h1> I am Muthu karthikeyan</h1>
     <h2> I love teaching</h2>
     <p>
     On the Insert tab, the galleries include items that are designed to coordinate with the overall look of your document. You can use these galleries to insert tables, headers, footers, lists, cover pages,and other document building blocks. When you create pictures, charts, or diagrams, they also    coordinate with your current document look.
     </p>
</body>
</html>   

வெளியீடு:



மேலே உள்ள நிரலில் h1 டேக்கானது மத்தியிலும் h2 டேக்கானது இடது புறத்திலும் அலைன் செய்யப்பட்டுள்ளது. பாராவானது இடது மற்றும் வலது இரு புறத்திலும் சீர் செய்யப்பயன்படுகின்றது.

லைன் ஹைட்(line height)

இந்த பண்பானது ஒரு பாராவில் உள்ள ஒவ்வொரு வரியின் உயரத்தையும் மாற்றியமைக்கப்பயன்படுகின்றது.
சான்று நிரல்-6:
<!DOCTYPE html>
<html>
<head>
<style>

p{
text-align:justify;
line-height::40px;
}
</style>
</head>
<body>        
     <p>
     On the Insert tab, the galleries include items that are designed to coordinate with the overall look of your document. You can use these galleries to insert tables, headers, footers, lists, cover pages,   and other document building blocks. When you create pictures, charts, or diagrams, they also    coordinate with your current document look.
     </p>
</body>
</html>   
வெளியீடு:



-----------முத்து கார்த்திகேயன்,மதுரை.




ads Udanz