How To Divide a page into 10 Pieces/sections using Html and css

Html code

<div id="content">

<div style="width:100%;background-color:#CCC; height:auto;" >

<div id="aside"></div>

<div id="section"></div>

</div>

<div style="width:100%;background-color:#CCC; height:auto;">

<div class="info" style="background-color:#993"> </div>

<div class="info" style="background-color:#943"> </div>

<div class="info" style="background-color:#933"> </div>

<div class="info" style="background-color:#603"> </div>

<div class="info" style="background-color:#593"> </div>

<div class="info" style="background-color:#043"> </div>

<div class="info" style="background-color:#633"> </div>

<div class="info" style="background-color:#313"> </div>

<div class="info" style="background-color:#293"> </div>

<div class="info" style="background-color:#923"> </div>

</div>

</div>

css code:

#content

{

width:100%;

height:600px;

background-color:#099;

}

#aside

{

width:25%;

height:200px;

background-color:#F00;

float:left;

}

#section

{

width:75%;

height:200px;

background-color:#03C;

float:left;

}

.info

{

width:10%;

height:200px;

background-color:#03C;

float:left;

}

DATABASE APPLICATION # 2.1 (Return a single value form database )

using System;
using System.Collections.Generic;
using System.Data.SqlClient;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Configuration;

namespace WindowsFormsApplication4
{
    class returnclass
    {
        private string connstring = ConfigurationManager.ConnectionStrings["TESTDB"].ConnectionString;
     
       
        public string scalarReturn(string q)
        {string s=" ";
            SqlConnection conn = new SqlConnection(connstring);
            conn.Open();

            try
            {
                SqlCommand cmd = new SqlCommand(q, conn);
                s = cmd.ExecuteScalar().ToString();
         
            }
            catch (Exception)
            {
                s = " ";  
           
            }
         
            return s;

        }




    }
}

Database application # 5 VIEWS AND SEARCH FILTER

public partial class viewform : Form
    {
        viewclass vc = new viewclass();
        string q;
        public viewform()
        {
            InitializeComponent();
        }

        private void button1_Click(object sender, EventArgs e)
        {
            q = "select s.std_id as 'id',s.std_name as 'Name',s.std_fname AS 'Father name',s.std_gender as 'Gender',s.std_address as 'Address',s.std_admissiondate as 'Admission Date' ,a.ad_name as 'Admin Name' from student s inner join administator a on a.ad_id=s.std_ad_fk_id where s.std_id=" + textBox2.Text;
            dataGridView1.DataSource = vc.showrecord(q);

            returnclass rc = new returnclass();
          string pathquerry=  rc.scalarReturn("select img_path from student_img where img_fk="+textBox2.Text);
          pictureBox1.Image = Image.FromFile(pathquerry);
          pictureBox1.SizeMode = PictureBoxSizeMode.StretchImage;

           

        }

        private void viewform_Load(object sender, EventArgs e)
        {
            q = "select s.std_id as 'id',s.std_name as 'Name',s.std_fname AS 'Father name',s.std_gender as 'Gender',s.std_address as 'Address',s.std_admissiondate as 'Admission Date' ,a.ad_name as 'Admin Name' from student s inner join administator a on a.ad_id=s.std_ad_fk_id";
            dataGridView1.DataSource = vc.showrecord(q);

        }

        private void textBox1_KeyUp(object sender, KeyEventArgs e)
        {
            q = "select s.std_id as 'id',s.std_name as 'Name',s.std_fname AS 'Father name',s.std_gender as 'Gender',s.std_address as 'Address',s.std_admissiondate as 'Admission Date' ,a.ad_name as 'Admin Name' from student s inner join administator a on a.ad_id=s.std_ad_fk_id where s.std_name like '" + textBox1.Text + "%'";
            dataGridView1.DataSource = vc.showrecord(q);

        }
       
    }
}

Database Application # 3 (Store Procedure of Data Insertion )

Store Procedure of Data Insertion in student Table

Create proc [dbo].[insert_student]
(
@std_name nvarchar(20),
@std_fname nvarchar(20),
@std_gender nvarchar(6),
@std_address nvarchar(100),
@std_admissiondate nvarchar(20),
@std_ad_fk_id int

)
as

begin

insert into student(std_name,std_fname,std_gender,std_address,std_admissiondate,std_ad_fk_id)
values(@std_name,@std_fname,@std_gender,@std_address,@std_admissiondate,@std_ad_fk_id)

end

Anchor Tag /Hyper Link in HTML-5

Anchor Tag /Hyper Link

Guide:
1-Make a folder on desktop named as "Anchor Tag"
2-In "Anchor Tag" folder make 4 folders named as  img, js, pages and css
3-Open your code Editor , copy the below html and paste it , and save the file named as index.html in "Anchor Tag" folder
4-Now Create another html page , name it as "aboutus.html" & save it in pages folder.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Anchor tag</title>
</head>

<body>

<h1> Index Page</h1>


<UL>

<LI>
<a target="_blank"  href="pages/ABOUTUS.html"> About Us page ( using blank  attribute )</a>
</Li>

<LI>
<a target="_self"  href="pages/ABOUTUS.html"> About Us page ( using self  attribute )</a>
</Li>


<LI>
<a target="_top"  href="pages/ABOUTUS.html"> About Us page ( using top  attribute )</a>
</Li>





</UL>




</body>
</html>

WEB PAGE LAYOUT USING HTML & CSS (css-code)

Css Code:

@charset "utf-8";
/* CSS Document */
body
{ margin:0 auto;
  padding:0px;
  background-color:#9CF;
}
#wrapper
{
margin:0 auto;
width:80%;
height:1000px;
background-color:#906;

}
header
{
width:100%;
height:200px;
background-color:#0F0;

}
nav
{
width:100%;
height:50px;
background-color:#FC9;

}
nav ul
{ margin:0;
list-style-type:none;
}
nav ul li
{
float:left;
margin-top:10px;


}
nav ul li a
{ text-decoration:none;
font-size:26px;
padding:10px;
color:#FFF;
}
a:hover
{
color:#00C;
background-color:#FFF;

}
#content
{
width:100%;
height:600px;
background-color:#099;
}
#foot
{
width:100%;
height:200px;
background-color:#333;

}

WEB PAGE LAYOUT USING HTML & CSS (html code)

HTML CODE:

copy and paste the code in code editor

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>layout</title>

<link href="css/style.css" type="text/css" rel="stylesheet">
</head>

<body>
<div id="wrapper">
<header>
<img src="img/logo.png" style="width:200px;height:150px;margin-left:10px;margin-top:20px;"/>
</header>
<nav>
<ul>
<li><a href="index.html">Home</a> </li>
<li><a href="pages/admission.html">Admission</a> </li>
<li><a href="pages/aboutus.html">About Us</a> </li>
<li><a href="pages/contactus.html">Contact Us</a> </li>


</ul>
</nav>
<div id="content">



</div>







<div id="foot">

</div>
</div>
</body>
</html>