2 : سكشن علياء هشام عبد المنعم عبدالحميد: االسم
First : HTML
<!doctype html>:
represent the document type and help the browser to display web
page correctly.
<html> :
start point for the code “closen tag”</html>
<head> :
content of all metadata for the web “closen tag”</head>
<body>:
define the document body “closen tag”</bodyl>
Heading element in html <h>: headings are titles or subtitles that you want to
display on a webpage
<h1>: defines the most important heading.
<h1>hello</h1>
<h6>: defines the least important heading.
<h6>copyrights<h6>
<Style>:
to make style for elments in html
<img src=”” alt =””> :
to set image in the document
HTML Title <title>:
defines a title in the browser toolbar
<title> cart </title>
HTML Lists:
allow web developers to group a set of related items in lists.
Order list <ol>: tag.
Each list item starts with the <li> tag.
The list items will be marked with numbers
Ex:
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
allow web developers to group a set of related items in lists.
Order list <ul>: tag.
Each list item starts with the <li> tag.
The list items will be marked with bullests
Ex:
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
The HTML class: attribute is used to specify a class for an HTML element
<body class=”container”></body>
The HTML id: attribute is used to specify a unique id for an HTML element.
<body id=”item”></body>
Second: css
Css is Cascading Style Sheets (CSS)
Syntax :Selector { property : value; }
Selector { background-color: Any Color; }
Background color of an element
Selector { font-family: sanserif; }
Specify font type
Selector {margin: numirc value; }
Surrounding margins
Selector{ text-align:center}
Aligment of a text
Selector {font-wieght :200}
The boldiness of a font
Selector{letter-spacing :30px}
The space between characters
Selector:hover{}
When mouse hovers
Selector{box-shadow:color}
Make colored shadow for the box
Third: Bootstrap
Grid system in bootstrap: is built with flexbox and allows up to 12
colums across the page.
Grid class:
col- (extra small devices - screen width less than 576px)
col-sm- (small devices - screen width equal to or greater
than 576px)
col-md- (medium devices - screen width equal to or greater
than 768px)
col-lg- (large devices - screen width equal to or greater
than 992px)
col-xl- (xlarge devices - screen width equal to or greater
than 1200px)
col-xxl- (xxlarge devices - screen width equal to or greater
than 1400px)
Bootstrap Containers: are used to pad the content inside of them,
and there are two container classes available:
The .container class provides a responsive fixed width
container
The .container-fluid class provides a full width container spanning
the entire width of the viewport
Bootstrap navbar :with bootstrap a nav bar can extend or collapse
depending on screen size.
Fourth:PHP
PHP can create, open, read, write, delete, and close files on the server
PHP can collect form data
PHP can add, delete, modify data in your database
Php code: In suntax php the code start with “<?php ” and end “?>”
variable starts with the “$” sign, followed by the name of the variable
Ex $x=8;
Echo: statement is used to output data to the screen.
Ex echo “hello world“ ;
Foreach($array/$var){Statements; } :
Is used as a for loop to loop an array
Fifth:sql
The PHP super globals $_GET and $_POST are used to
collect from data.
$sql=”select * from tbl_name”;
$con=( ”localhost” , “root” , “” ,”bd_name” );