The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> BOOTSTRAP, please give me feedback
deb1
post Jun 13 2020, 12:55 AM
Post #1


Advanced Member
****

Group: Members
Posts: 109
Joined: 7-May 20
Member No.: 27,330



<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<h2>Basic Progress Bar</h2>
<p>To create a default progress bar, add a .progress class to a container element and add the progress-bar class to its child element. Use the CSS width property to set the width of the progress bar:</p>
<div class="progress">
<div class="progress-bar" style="width:70%"></div>
</div>
</div>

</body>
</html>


For this bootstrap coding above do i always need to include this lines in :

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>


please let me know smile.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jun 13 2020, 04:58 AM
Post #2


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



Are you taking a class now?

I don't see the progress bar moving. Is it supposed to?

Don't use the style attribute if you can avoid it.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
deb1
post Jun 13 2020, 11:22 AM
Post #3


Advanced Member
****

Group: Members
Posts: 109
Joined: 7-May 20
Member No.: 27,330



QUOTE(pandy @ Jun 13 2020, 04:58 AM) *

Are you taking a class now?

I don't see the progress bar moving. Is it supposed to?

Don't use the style attribute if you can avoid it.



No dear ,i am not taking any class. just learning all this by myself from home and with help from you smile.gif
you said don't use the style attribute ...... which line are you referring to because i can't find it . so can
you write it out for me so that i can understand what you mean please smile.gif

This post has been edited by deb1: Jun 13 2020, 11:23 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jun 13 2020, 12:02 PM
Post #4


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



QUOTE(deb1 @ Jun 13 2020, 07:55 AM) *

CODE
<div class="progress-bar" style="width:70%"></div>



https://htmlhelp.com/reference/css/style-html.html#inlining
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
deb1
post Jun 13 2020, 12:34 PM
Post #5


Advanced Member
****

Group: Members
Posts: 109
Joined: 7-May 20
Member No.: 27,330



QUOTE(pandy @ Jun 13 2020, 12:02 PM) *

QUOTE(deb1 @ Jun 13 2020, 07:55 AM) *

CODE
<div class="progress-bar" style="width:70%"></div>



https://htmlhelp.com/reference/css/style-html.html#inlining


so that line is not necessary ?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jun 13 2020, 01:04 PM
Post #6


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



Did you read the page I linked to? If not, do so now. It describes the three ways you can connect the CSS to your HTML. Inline CSS (=using the style attribute) isn't wrong, the validator won't complain about it. It's just that it is the most ineffective way you can do it. Keep all your CSS in one place, not scattered all over the HTML. In this case you have only one instance of the style attribute, but no point getting into bad habits.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
deb1
post Jun 14 2020, 02:29 AM
Post #7


Advanced Member
****

Group: Members
Posts: 109
Joined: 7-May 20
Member No.: 27,330



so bootstrap is like CSS file?
after writing a bootstrap file do i have to link it to html file like CSS file?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jun 14 2020, 05:48 AM
Post #8


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



Do you mean the bits you actually write yourself? It will be mostly JavaScript, I think, but some CSS too. I assume you can just add it to any other CSS or JS you may have, but I don't know.

Read the documentation. All of it. biggrin.gif
https://getbootstrap.com/docs/4.5/getting-s...d/introduction/
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 18th April 2024 - 10:29 PM