-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathpost.html
226 lines (188 loc) · 9.74 KB
/
post.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>AMOS ADAGBOYI TECHNICAL BLOG</title>
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="css/simple-blog-template.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html">AMOS ADAGBOYI TECHNICAL BLOG</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li>
<a href="about.html">About</a>
</li>
<li>
<a href="login.html">Login</a>
</li>
<li>
<a href="signup.html">Sign up</a>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
<!-- Page Content -->
<div class="container">
<div class="row">
<!-- Blog Post Content Column -->
<div class="col-lg-12">
<!-- Blog Post -->
<!-- Title -->
<h1 class="post-title">Getting Started with Web development</h1>
<!-- Author -->
<p class="lead">
by Amos Adagboyi
</p>
<hr>
<!-- Date/Time -->
<p><span class="glyphicon glyphicon-time"></span> Posted on October 15, 2022 at 10:00 PM</p>
<hr>
<!-- Post Content -->
<p>HTML,CSS and Javascript along with its frameworks and libraies are the core foundation of every web page hosted on the internet.HTML means Hyper text mark up language, it is not a programming language but a mark up language useful for structring details or information on a webpage. the latest of version of HTML is HTML5 which has many added and improved fuctions absent in HTML4.</p>it is a welcome enhancement that
increases the flexibility and usefulness of HTML. It also solves some problems; for instance, it can dispense with plugins for embedded video and audio clips, and the number of video file formats is drastically reduced.HTML5 has brought agreement between the browser vendors because they participated in its formulation. This means that the way they handle coding errors is now standardized; all those little differences are ironed out. A browser’s parsing rules as specified by HTML5 ensure that all existing websites continue to function as before. <br> <br> <img src="/img/html.jpg" alt="html"
width="300" height="250">
.</p>
<p style="color:red">image showing Html header</p>
<p>CSS means cascading style sheets. CSS is used for styling, designing, adding colours, changing text fonts, adding background colors and image, styling text buttons e.t.c.The latest version of CSS is CSS3.The advanced properties in CSS3 allow for more fanciful styling of your website, such as adding transitions and animations.There are three ways to apply CSS code to your site.The first is by linking to an external file. This is the recommended method. To do linking, you need to write your CSS rules in a separate text file and save it
with a .css extension.</p> The syntax for adding the rules to your HTML code is link rel="stylesheet" type="text/css" href="style.css" You add the link tag to the head element, between the head.../head. tags. The first two attributes rel and type tell the browser that this is a CSS stylesheet. The first thing to learn about CSS is its syntax,which is relatively straightforward. The syntax is:selector { property : value; property : value; property : value; }. All elements in CSS are treated as boxes. CSS boxes consist of margins, borders,padding.<br><br><img src="/img/css.png" alt="html"
width="300" height="250" align="left">
</p>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<p style="color:red">image showing a css file being added to an html header</p>
<p>JavaScript brings a dynamic functionality to your websites. Every time you see something pop up when you mouse over an item in the browser, or see new text, colors, orimages appear on the page in front of your eyes, or grab an object on the page and
drag it to a new location—all those things are done through JavaScript. It offers effects that are not otherwise possible, because it runs inside the browser and has
direct access to all the elements in a web document.<p> JavaScript is a client-side scripting language that runs entirely inside the web browser. To call it up, you place it between opening script and closing /script HTML tagsJavaScript is a powerful programming language with many frameworks and libraies, Javscript makes webpages dynamic, it controls how the website or webpage interacts with users some which are used in implementing frontend and backend fuctions of websites.</p> A JavaScript framework is a collection of JavaScript code libraies, it offers reusable code components, a universal development environment, compilers e.t.c In addition to writing JavaScript code directly in HTML documents, you can include files of JavaScript code either from your website or from anywhere on the internet.The syntax for this is as follows:
script type="text/javascript" src="script.js">/script.
<br> <br> <img src="/img/javascript.jpg" alt="javascript" width="400" height="300" align="left"></p>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<hr>
<br>
<p style="color:red">Image showing a javascript script being added to an Html file</p>
<!-- Blog Comments -->
<!-- Comments Form -->
<br>
<br>
<br>
<br>
<div class="well">
<h4>Leave a Comment:</h4>
<form role="form">
<div class="form-group">
<textarea class="form-control" rows="3"></textarea>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
<hr>
<!-- Posted Comments -->
<!-- Comment -->
<div class="media">
<a class="pull-left" href="#">
<img class="media-object" src="http://placehold.it/64x64" alt="">
</a>
<div class="media-body">
<h4 class="media-heading">Andrew Chavez
<small>October 16, 2022 at 10:30 AM</small>
</h4>
Nice Article. very detailed and comprehensive.
</div>
</div>
<!-- Comment -->
<div class="media">
<a class="pull-left" href="#">
<img class="media-object" src="http://placehold.it/64x64" alt="">
</a>
<div class="media-body">
<h4 class="media-heading">Richard Oneal
<small>October 16, 2022 at 5:30 PM</small>
</h4>
This is simply a basic summary of web development which is very insightful and interesting, I am looking forward to reading more articles from your blog.
<!-- Nested Comment -->
<div class="media">
<a class="pull-left" href="#">
<img class="media-object" src="http://placehold.it/64x64" alt="">
</a>
<div class="media-body">
<h4 class="media-heading">Berry Green
<small>October 17, 2022 at 9:40 PM</small>
</h4>
Yes, this is a good post without any doubts. You really doing a great Job. I inspired from you. So keep it up!!.
</div>
</div>
<!-- End Nested Comment -->
</div>
</div>
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer>
<div class="container">
<div class="row">
<div class="col-lg-12">
<p>Copyright © Your Website 2022</p>
</div>
<!-- /.col-lg-12 -->
</div>
<!-- /.row -->
</div>
</footer>
<!-- jQuery -->
<script src="js/jquery.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
</body>
</html>