Monday, 19 October 2020

Part 2 How to convert PSD to HTML Hero Section CSS [HTML CSS] [Code Fusion]

 


Here is the Source code for the video

/* font  */
/* font-family: 'Lato', sans-serif; */

/* CSS RESET */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

body {
    line-height: 1;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* CSS RESET END */

/* helper class */
.m0 {
    margin: 0;
}

.right-align {
    float: right;
}

.left-align {
    float: left;
}

.clear-float {
    clear: both;
}

.clearfix:after {
    content: " ";
    /* Older browser do not support empty content */
    visibility: hidden;
    display: block;
    height: 0;
    clear: both;
}

body {
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 18px;
}

a {
    text-decoration: none;
    color: #000;
}

/* HERO SECTION  */

#hero {
    background-image: url("../img/hero-bg.png");
    color: #fff;
    background-position: center;
    background-size: cover;
    height: 745px;

}

header {
    padding-top: 60px;
}

.container {
    max-width: 1163px;
    margin: 0 auto;
    padding: 0 20px;
}


.container nav ul li {
    display: inline;
}

.container nav ul li a {
    color: #fff;
    font-size: 18px;
    line-height: 13px;
    margin-right: 56px;
    text-transform: uppercase;
    transition: 0.3s;
}

.container nav ul li a:hover {
    font-weight: 700;
    color: #000;
    transition: 0.3s;
}

.cta {
    margin-top: 177px;
    text-align: center;
}

.cta h1 {
    font-size: 65px;
    line-height: 70px;

}

.cta h2 {
    margin: 30px 0 90px 0;
    font-size: 33px;
}

.btn-more {
    color: #fff;
    padding: 20px 54px;
    border: 1px solid #ffffff;
    border-radius: 57px;
    font-size: 18px;
    transition: 0.3s;
}

.btn-more:hover {
    background: #fff;
    color: #7147a5;
    transition: 0.3s;
    font-size: 20px;
}

Please Like and subscribe to my channel

Tuesday, 13 October 2020

Part 1 How to convert PSD to HTML Hero Section [HTM/ CSS]

 


 Source Code of the video is Down below

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>awsome</title>
    <link rel="stylesheet" href="css/animate.css">
    <!-- google Fonts -->
    <link href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&display=swap" rel="stylesheet">
    <script src="https://kit.fontawesome.com/7e2e7bef6f.js" crossorigin="anonymous"></script>

    
</head>

<body>
    <!-- HERO SECTION -->
    <section id="hero">
        <div class="container">
            <header>
                <div class="logo left-align">
                    <a href="#"> <img src="img/logo.png" alt="logo"></a>
                </div>
                <!-- NAVBAR -->
                <nav class="navbar right-align">
                    <a class="burger-nav"></a>
                    <ul>
                        <li><a href="#">Home</a></li>
                        <li><a href="#">service</a></li>
                        <li><a href="#">portfolio</a></li>
                        <li><a href="#" class="m0">contact</a></li>
                    </ul>
                </nav>
            </header>
            <div class="cta clear-float wow zoomIn">
                <h1>Have an amazing business meeting</h1>
                <h2>Small business with big dreams</h2>
                <a href="#" class="btn-more">Learn more</a>
            </div>
        </div>
    </section>

Sunday, 5 April 2015

Part 3 How to create Table foreign Key and Primary key

SQL is all about Tables so in this session we discuss about table and concept related to tables like foreign Key Primary Key.

First we will create a table Graphically and by Query.
To create a table Graphically Expand the database > Right click on table click on new Table

How to Create a table graphically


Friday, 17 October 2014

Part 2 Creating and Drop a Database

In  part 1 What is SQL Server we understand the concept SQL Server 2008 and How to connect to SQL server. In this Session we understand how to create or delete the database. There are two ways to do almost everything in SQL Server 2008

  • Graphically with SSMS
  • With Query
First we talk How to create or delete Graphically

open your SSMS go to object Explore Right click on database folder and select New Database.


Part 2 Creating and Drop a Database

After that a New Database dialog box appear

Set the Database Name <DB Name> what ever you want My is Sample 1 and click OK

Expand Database folder and new database is created name Sample 1.
If database is not shown for some reason just Right click  Database folder and refresh .

Now we create a database using Query

Create Database <DB_Name>

When we create a database behind the scenes two files are created
to get to the file Right click the database and click properties

Properties Window opens. select file Go to the path

Copy that path and past to run window.. to open run click window button + R.
There are 2 files .mdf and log.ldf

these two file are associated  with a database we created.
.mdf is actual database file (Master Database File)
.log.ldf is Transaction log file (its a recovery file)

Now we discuss how to rename the DB graphically
just Right Click the DB and click rename

there are two ways to write a query for rename DB

Alter Database <Original name> Modify Name = <New Name>
OR
By system store procedure. store procedure are covered later session For now understand they are only a group of commands.
and there are 2 types of store procedure user define store procedure and system store procedure as name suggest user store procedure are created by user and system store procedure are provided by

Execute sp_renameDB'OldName','NewName'

Now we discuss how to delete DB
Grapically
Right Click DB and click Delete

By Query

drop database <DB Name>

Thursday, 16 October 2014

Free SQL Server Tutorials

Part 1 What is SQL Server


Sql server and database are two different things.

Sql server management studio is a client tool which is use to do operations on database  with commands terms as queries. SSMS is not a database.

 all table, views, triggers are created by SSMS and stored on one database.

SSMS give us flexibility of multi-user operate single database environment.

 

Connecting to Sql server 2008

Start -> All Programs -> Microsoft SQL Server 2008 -> SQL Server Management Studio

a connecting window shows up


first you  see  server type. There are different server type shown in dropdown list. select Database Engine, we'll talk other types later
server name 

If you have the multiple user environment shown in figure 1 above set the server name as your pc name or your pc IP address. 
In my case I can select my local pc name as (local) or . or IP

Authentication 
there are two type of authorizations Windows authentication and Sql Server  authentication 
these type are depends on How you install sql server. If you install mix mode both type are shown, if you sql server only Sql Server  authentication 

If you select Sql Server  authentication you need to give username and password where as if you select Windows authentication Windows authentication there is no need of giving username and password and click connect 

the instance of sql server is created and connect 


after connecting  this screen is shown. To write a query click New Query button a query editing window generated. In next session we write query and create user define database.

Wednesday, 15 October 2014

Lesson 20 ER diagram



Lesson 19 Aggregation

Aggregation is the process of compiling information on an object, there by abstracting a higher level object. One limitation of E-R model is that it cannot express relationship with in relationship to illustrate the need for such a construct the ternary (compose of three) relationship work_on, between employee branch job so in figure. Thus the relationship set work_on relating the entity set, such an entity set is treated in the same manner as in any other entity set. We can then created a binary relationship manager to represent who manage what task




Tuesday, 14 October 2014

Lesson 18 What is class and object

What is class?
Class is a set of object that share common structure and common behaviour is called class.
For example
Flora, fauna, flower, animal, bird etc..
What is object?
An object is something that has a fixed set of well define boundary. If you look at your computer disk you would object varying descriptions


For example
A keyboard may be attached to pc and it is also easy to see different parts of pc are distinct objects


&Note

In ordinary sense, an object is something which can be seen, touch or sensed.

Lesson 17 Inheritance

Inheritance means that the behaviour and data associated with child classes are always an extension of the properties associated with present class. A subclass must have all the properties of the present class and other properties as well.