Skip to main content

Web Designing : Web Page Using HTML, CSS, PHP And JavaScript

Overview Of Web Development

เคจเคฎเคธ्เค•ाเคฐ เคฆोเคธ्เคคों เค†เคช เคฒोเค—ो เค•ा เคธ्เคตाเค—เคค เคนै เคฎेเคฐे เคจเค เคฌ्เคฒॉเค— เคชเคฐ เค‡เคธ Post เคฎें เคนเคฎ เคฌเคคाเคंเค—े เค•ी simple website เค•ैเคธे เคฌเคจाเคคे เคนैं | เค…เค—เคฐ เค†เคช Engineering Student เคนै เคคो เค†เคช เค•ो เคฎै suggest เค•เคฐूँเค—ा เค•ी เค†เคช เค…เคชเคจे เคธे เค–ुเคฆ Website banaye , เค‰เคธเค•े เคฒिเค เค†เคชเค•ो เค•ुเค› เคœाเคจเค•ाเคฐी เคนोเคจा เคœเคฐुเคฐी เคนै | 

เคœเคฐुเคฐी skills website เคฌเคจाเคจे เค•े เคฒिเค :-

1. HTML 
2. CSS 
3. Javascript 
4. PHP 

1. HTML 

เค‡เคธเค•ा full form '' Hypertext Markup Language " เคนैं |  เค‡เคธเค•ा use website เค•े เคชेเคœ เคฌเคจाเคจे เค•े เคฒिเค เค•िเคฏा เคœाเคคा เคนैं |  HTML tags เค•ा use เค•िเคฏा เคœाเคคा เคนै contet เค•ो เคฒिเค–เคจे เค•े เคฒिเค | Html tag เคœैเคธे เค•ि <!DOCTYPE >, <html>, <h>, <p>, <body>, <frame>, <a></a>,<hr>,<head>,<title>, etc
HTML Code Syntax :-

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html> . 

HTML Page :-


เคฏे HTML Simple  Website Page เคนैं |  เคเคธे เคนी เค†เคช เคœिเคคเคจे Text เคšाเคนेंเค—े เคœोเฅœ เคธเค•เคคे เคนै เค…เคชเคจे Website เค•े เค…เคจुเคธाเคฐ เค”เคฐ เคตे เคธเคฐे เคšीเคœ เค†เคชเค•े เคตेเคฌ เคชेเคœ เคชเคฐ เคฆिเค–ाเคˆ  เคฆेเค—ा |  Html เค•ा เคœो Text เคนोเคคा เคนै เคตो เค•िเคธी เคญी เคšीเคœ เค•ो explain เค•เคฐเคคा เคนै ,เค†เคช เคœिเคธ เคฌाเคฐे เคฎें เคฌเคคाเคจा เคšाเคนเคคे เคนै เคตो html เค•เคฐเคคा เคนैं | 

2. CSS 

CSS เค•ो Cascading Style Sheet เค•เคนा เคœाเคคा เคนै | CSS เค•ा use web pages เค•ो design เค•เคฐเคจे เค•े เคฒिเค เค•िเคฏा เคœाเคคा เคนै |เค•्เคฏोเค•ि เค•ेเคตเคฒ  html เค•े เคฆ्เคตाเคฐा  web page เค•ो เค…เคš्เค›े เคธे  เคฆिเค–ा เคจเคนी เค•เคฐ เคธเค•เคคे เคนै | เค‡เคธीเคฒिเค เคนเคฎ CSS  เค•ा use เค•เคฐเคคे เคนै | เค•्เคฏोเค•ि CSS  เค•े เคฆ्เคตाเคฐा Website เค•ो เค…เคชเคจे เค…เคจुเคธाเคฐ เคœैเคธा เคšाเคนे เคฆिเค–ा เคธเค•เคคे เคนै เค”เคฐ เค…เคชเคจे Website เค•ो attractive เคฌเคจा เคธเค•เคคे เคนै |

CSS 3 เคช्เคฐเค•ाเคฐ เค•ा เคนोเคคा เคนै:-
  1. Inline CSS
  2. Internal CSS
  3. External CSS
  

Inline CSS

Inline CSS เค•ा use HTML tags เค•े เค…เคจ्เคฆเคฐ เคนी เค•िเคฏा เคœाเคคा เคนै | เคฒेเค•िเคจ เค‡เคธเค•े เคฒिเค เคนเคฎे style attribute เค•ा use เค•เคฐเคจा เคชเคก़เคคा เคนै |

Internal CSS

Internal CSS เคฒिเค–เคจे เค•े เคฒिเค เคนเคฎे style tag เค•ो create เค•เคฐเคจा เคชเคก़เคคा เคนै | เค•्เคฏोเค•ि เคฌिเคจा style tag เค•े Internal CSS เคจเคนी เคฒिเค– เคธเค•เคคे เคนै |

External CSS

External CSS เคฒिเค–เคจे เค•े เคฒिเค เคนเคฎे เคเค• file create เค•เคฐเคจा เคชเคก़เคคा เคนै | เค”เคฐ เคœเคฌ เคญी External CSS เค•ी file create เค•เคฐเคคे เคนै | เคคो CSS file เค•ा extension .css เคฆेเคจा เคนोเคคा เคนै |

Note :- เค…เค—เคฐ เค†เคช Inline CSS เค•े เค…เคจ्เคฆเคฐ css เค•ी เค•ोเคˆ property use เค•เคฐ เคฒेเคคे เคนै | เค”เคฐ เคตเคนी property Internal CSS เคฏा External CSS เคฎे use เค•เคฐเคคे เคนै | เคคो External CSS เคฏा Internal CSS เค•ी property work เคจเคนी เค•เคฐเคคी เคนै | เค•्เคฏोเค•ि เค‰เคธ property เค•ो Inline CSS เคฎे use เค•เคฐ เคฒिเค เคนै |

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
 <style>
  h1 {
  text-align: center;
  color: red;
}
</style>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html> . 

CSS  เค•ो เคนเคฎेเคถा style tag เค•े เค…ंเคฆเคฐ เคนी เคฒिเค–เคคे เคนैं | เคŠเคชเคฐ เคตाเคฒे เค‰เคฆ्เคงเคฐเคฃ เค•े เค…เคจुเคธाเคฐ เคœो Text เคฒिเค–ा เค—เคฏा เคนै "My first heading" screen เค•े เคฌीเคš เคฎें เคšเคฒा เคœाเคฏेเค—ा เค”เคฐ เค‰เคธเค•ा color เคฒाเคฒ เคนो เคœाเคฏेเค—ा | 

Graphic interface เค•े เคฒिเค complete web page เคฌเคนुเคค เคนी เค…เคš्เค›े เคธे design เค•เคฐ เคธเค•เคคे เคนै | เค”เคฐ CSS เคฒिเค–เคจे เค•े เคฒिเค property and value เค•ा use เค•िเคฏा เคœाเคคा เคนै | 

CSS เค•ि เค•ुเค› Advantages :-

  • CSS เคเค• เคเคธा language เคนै เคœिเคธเค•ा เคฏूเคœ़ เค•เคฐเคจे เคธे เคนเคฎाเคฐा time เคฌเคšเคคा เคนै। เค”เคฐ เค•เคฎ เคธे เค•เคฎ เคธเคฎเคฏ เคฎे เคเค• เคธे เคœाเคฆा web pages เค•ो เค…เคชเคจे เค…เคจुเคธाเคฐ เคœैเคธा เคšाเคนे เคฆिเค–ा เคธเค•เคคे เคนै |
  • เคนเคฎ CSS เค•ी library เคฌเคจा เคธเค•เคคे เคนै | เค”เคฐ เคœเคฌ เคšाเคนे เค‰เคธे เค•िเคธी เคญी web page เคชเคฐ apply เค•เคฐ เคธเค•เคคे เคนै |เค”เคฐ เคœเคฐूเคฐเคค เคชเคก़เคจे เคชเคฐ customize เคญी เค•เคฐ เคธเค•เคคे เคนै |
  • CSS เค•े เคฆ्เคตाเคฐा web pages เค•ो customize เค•เคฐเคจा เคฌเคนुเคค เคนी เค†เคธเคจ เคนोเคคा เคนै | เค•्เคฏोเค•ि CSS เคเค• เค†เคธाเคจ  language เคนै | เคœिเคธे เคนเคฐ เค•ोเคˆ เค†เคธाเคจी เคธे เคธिเค– เคธเค•เคคा เคนै |
  • CSS เคเค• เคเคธा language เคนै | เคœो html language เคธे เคœाเคฆा option provide เค•เคฐเคคा เคนै | เคนเคฎाเคฐे web page attractive เคฌเคจाเคจे เค•े เคฒिเค |

3. JavaScript

 JavaScript เคเค• client side scripting language เคนैं|  เคฏเคน Client เค•ेเคฌ्เคฐाเค‰เฅ›เคฐ เคชเคฐ run เค•เคฐเคคा เคนैं| เค‡เคธเค•े เค‡เคธ्เคคेเคฎाเคฒ เคธे เค•िเคธी เคญी HTML เคชेเคœ เค•ो เคเค• เคธाเคฅ เคœोเฅœ เคธเค•เคคे เคนैं | เค…เคชเคจे เคชेเคœ เค•े เค•ंเคŸेंเคŸ เค•ो change เค•เคฐ เคธเค•เคคेเคนैं| เคฏเคน open เค”เคฐ เค•्เคฐॉเคธ-เคช्เคฒेเคŸเคซाเคฐ्เคฎ เคนै เคœिเคธเค•ा เคฏूเคœเคฐเค•ो better experience เคฆेเคจा เคนैं|

JavaScript เค•ो HTML เค•े เค…เคจ्เคฆเคฐ เค”เคฐ <script> tag เค•े เคฌीเคš เคฎें เคฒिเค–เคคे เคนैं | เค‡เคธเค•ो websites เคฎें dynamic เค”เคฐ interactive elements เค•ो เคœोเฅœเคจे เค•े เคฒिเค เค•िเคฏा เค—เคฏा เคฅा |
เค‰เคฆ्เคงเคฐเคฃ เค•े เคฒिเค Program :- 

<script>
var d = new Date();
d.setFullYear(2020);
document.getElementById("demo").innerHTML = d;
</script>

เค‡เคธ Program เคฎें เคœिเคคเคจे เคญी code <script> and </script> เค•े เค…เคจ्เคฆเคฐ เคนै เคตे JavaScript code เคนैं|

4. PHP

PHP เคเค• server side scripting language เคนैं เค”เคฐ เค‡เคธเค•ा เคช्เคฐोเคฏोเค— dynamic เค”เคฐ Interactive เคชेเคœเค•ो เคฌเคจाเคจे เค•े เคฒिเค เค•िเคฏा เคœाเคคा เคนैं| PHP เค•े code เค•ो เคนเคฎ เคฒोเค— Html เค•े code เค•े เค…เคจ्เคฆเคฐ เคญी เคฒिเค– เคธเค•เคคे เคนै เคฏा dot .php เค•ा เคเค• เค…เคฒเค— Program เคฒिเค– เคธเค•เคคे เคนै เคคเคฌ เคนเคฎเคฒोเค—ों เค•ो Html เค”เคฐ php เค•े Program เค•ो เคœोเฅœเคจा เคชเฅœेเค—ा |
 เคธाเคงाเคฐเคฃ เค‰เคฆเคนाเคฐเคฃ เคฆेเค–เคคे เคนै :-
 <!DOCTYPE html>
<html>
<body>

<?php
echo "My first PHP script!";
?>

</body>
</html>

เค‡เคธเคฎें php เค•े code เค•ो <?php    ?> เค•े เคฌीเคš เคฎें เคฒिเค–ा เค—เคฏा เคนै | เค‡เคธ Program เคฎें php เค”เคฐ html เค•ा code เคเค• เคนी เคช्เคฐोเค—्เคฐाเคฎ เคฎें เคฒिเค–ा เค—เคฏा เคนैं|

Conclusion :- เค‡เคธ Post เคฎें เคฌเคคाเคฏा เค—เคฏा เคนै เค•ी เค†เคชเค•ो website เคฌเคจाเคจा เคนै เคคो เคฏे Basics of Html, CSS, JavaScript เค”เคฐ Php เคฅोเคกा เคฌเคนुเคค เค†เคจा เคšाเคนिเค | 
เคฆोเคธ्เคคों เค†เคชเค•ो เคฏे Post เค•ेเคธा เคฒเค—ा เคœเคฐुเคฐ เคฌเคคाเค‡เคฏेเค—ा เค”เคฐ comment เค”เคฐ เค…เคชเคจा Feedback เคญी เคฒिเค– เคฆीเคœिเคฏेเค—ा |
เคงเคจ्เคฏเคตाเคฆ....!
Labels:

Comments

Post a Comment

Popular posts from this blog

Fix Breadcrumbs Error And m=1? In Blogger

  Remove Breadcrumbs Errors And ?m=1 Breadcrumb is a small path. It points your location on your site. It also affects the SEO of your website.  Use canonical URL , so: data:blog.url.canonical  instead of data:blog.url. It should work for both desktop and mobile versions. It means the same URL works on both mobile and desktop without producing the ?m=1 or ?m=0. Before this, I am going to tell you what all the portions I will explain and fix your problem. First we will fix Breadcrumbs Error . This is the most dangerous for your website. Second we will remove ?m=1 and ?m=0, tags from our mobile view URL. Remove Breadcrumbs Error :- You should follow the below steps, so that you would fixed this error :- Go to blogger.com Login to blogger with your blogger email id Click on Template Click edit HTML, you have to edit HTML theme code. Press Ctr + F to open a search bar in your HTML theme code. Search for <div class='breadcrumbs' Paste the below code up to </b:loop> ...
Post a Comment
Read more

Blogger : How To Create Blog Through Blogger & Its Overview

Overview Of Creation Of Blog Now days online learning and earning is very popular. Most of the people is trying to either learn or earn from their home. If you are a writer or story teller, you have interest in writing or reading new thing. So, This is very helpful for you, in this post i will tell you how to create your own blog website and earn money. Step follow to create a blog on blogger:- First you should have a email account and phone number to open or create a blogging account. You have to go to blogger website page, URL of that page is given below, simply you go and click on the URL. Click on the create new blog, after clicking, you have enter the blog name that you want to show to the user and you must choose or set the appropriate your own blog URL. After this process, you will have created your blog. You can handle everything post, pages, layout, inside the setting,you can set the user information and the account information. In the layout you can set layout from the given ...
Post a Comment
Read more

API : What is an Application Programming Interface

Application Programming Interface API เค•ा เคชूเคฐा เคจाเคฎ "Application Programming Interface" เคนैं| เคฏเคน เคเค• software intermediary เคนै เคœो เคฆो software applications เค•ो เคเค• เคฆूเคธเคฐे เคธे เคฌाเคค เค•เคฐเคจे เค•ा เค•เคฎ เค•เคฐเคคा เคนैं| เคœैเคธे เค•ि เค‰เคฆ्เคงเคฐเคฃ เค•े เคฒिเค Instagram เคชเคฐ เค†เคชเค•ो message เค†เคคा เคนै เค”เคฐ เค†เคช เค…เคชเคจे phone เคชเคฐ check เค•เคฐ เคฒेเคคे เคนै API เค•े เค•ाเคฐเคฃ, เค•्เคฏोंเค•ि API เคเค• เคฎाเคง्เคฏเคฎ เคนै เค†เคชเค•े เฅžोเคจ เคฎें เค†เคช เค•िเคธी เคญी application เคธे เค‡เคจเคซाเคฐ्เคฎेเคถเคจ เคช्เคฐाเคช्เคค เค•เคฐ เคชเคคे  เคนैं| เคœเคฌ เค†เคช เค…เคชเคจे phone เคฎें  เค•ोเคˆ  application use เค•เคฐเคคे เคนै เคคो application internet เคธे เคœुเฅœเคคा เคนै เค”เคฐ data เค•ो server เคชเคฐ  เคญेเคœเคคा เคนै| เคคเคฌ เคตเคน server, data เค•ो เคฒेเคคा เคนै เค”เคฐ translate เค•เคฐเคคा เคนै เค‡เคธ data เค•ो , เค‰เคธเค•े เคฌाเคฆ เค‰เคธ data เคชเคฐ เคœเคฐुเคฐी เค•ाเคฐ्เคฏ เค•เคฐเคคा เคนै เค”เคฐ เค…ंเคคिเคฎ เคฎें เคœो translated data เคนै เค‰เคธे phone เคชเคฐ send เค•เคฐเคคा เคนैं| เคคเคฌ Application เค‰เคธ data เค•ो translate เค•เคฐเคคा เคนै เค”เคฐ เค†เคชเค•े เฅžोเคจ เคชเคฐ เคฆिเค–เคคा เคนै readable form เคฎें เคœैเคธा เค†เคช เคฆेเค–เคจा เคšाเคนเคคे เคนैं|  เคฏे เคœिเคคเคจे เคญी เค•ाเคฐ्เคฏ เคนै, phone เคธे data เค•ो เคฒेเคจा เค”เคฐ เค‰เคธे translate เค•เคฐ เค•े server เค•ो send เค•เคฐเคจा เค”เคฐ เคซिเคฐ เค‰เคธे phone เคชเคฐ user เค•े readable form เคฎें change เค•เคฐเค•े เค‰เคธเค•े เฅžोเคจ เคชเคฐ เคกिเคธ्เคช्เคฒे เค•เคฐเคจा, เคฏे เคธเคฌ API เค•े เคฎा...
Post a Comment
Read more