Cards Header & Footer

3 minutes
Share the link to this page
Copied
  Completed
You need to have access to the item to view this lesson.
One-time Fee
$99.99
List Price:  $139.99
You save:  $40
€93.70
List Price:  €131.19
You save:  €37.48
£80.17
List Price:  £112.24
You save:  £32.07
CA$137.56
List Price:  CA$192.60
You save:  CA$55.03
A$155.17
List Price:  A$217.25
You save:  A$62.07
S$135.98
List Price:  S$190.37
You save:  S$54.39
HK$783.01
List Price:  HK$1,096.25
You save:  HK$313.23
CHF 90.89
List Price:  CHF 127.26
You save:  CHF 36.36
NOK kr1,101.16
List Price:  NOK kr1,541.68
You save:  NOK kr440.51
DKK kr699.21
List Price:  DKK kr978.92
You save:  DKK kr279.71
NZ$168.70
List Price:  NZ$236.19
You save:  NZ$67.48
د.إ367.21
List Price:  د.إ514.11
You save:  د.إ146.90
৳10,942.52
List Price:  ৳15,319.96
You save:  ৳4,377.44
₹8,353.31
List Price:  ₹11,694.97
You save:  ₹3,341.66
RM478.30
List Price:  RM669.64
You save:  RM191.34
₦129,687.03
List Price:  ₦181,567.03
You save:  ₦51,880
₨27,754.24
List Price:  ₨38,857.05
You save:  ₨11,102.81
฿3,676.55
List Price:  ฿5,147.32
You save:  ฿1,470.77
₺3,250.48
List Price:  ₺4,550.80
You save:  ₺1,300.32
B$523.28
List Price:  B$732.62
You save:  B$209.33
R1,903.66
List Price:  R2,665.20
You save:  R761.54
Лв183.15
List Price:  Лв256.41
You save:  Лв73.26
₩137,464.20
List Price:  ₩192,455.38
You save:  ₩54,991.18
₪378.95
List Price:  ₪530.55
You save:  ₪151.59
₱5,720.89
List Price:  ₱8,009.48
You save:  ₱2,288.58
¥15,440.72
List Price:  ¥21,617.62
You save:  ¥6,176.90
MX$1,696.11
List Price:  MX$2,374.63
You save:  MX$678.51
QR363.78
List Price:  QR509.31
You save:  QR145.52
P1,378.02
List Price:  P1,929.29
You save:  P551.26
KSh13,298.67
List Price:  KSh18,618.67
You save:  KSh5,320
E£4,850.08
List Price:  E£6,790.31
You save:  E£1,940.22
ብር5,673.01
List Price:  ብር7,942.45
You save:  ብር2,269.43
Kz83,741.62
List Price:  Kz117,241.62
You save:  Kz33,500
CLP$97,883.21
List Price:  CLP$137,040.41
You save:  CLP$39,157.20
CN¥723.83
List Price:  CN¥1,013.40
You save:  CN¥289.56
RD$5,893.56
List Price:  RD$8,251.22
You save:  RD$2,357.66
DA13,447.21
List Price:  DA18,826.63
You save:  DA5,379.42
FJ$227.04
List Price:  FJ$317.87
You save:  FJ$90.82
Q775.43
List Price:  Q1,085.64
You save:  Q310.20
GY$20,874.74
List Price:  GY$29,225.48
You save:  GY$8,350.73
ISK kr14,084.59
List Price:  ISK kr19,718.99
You save:  ISK kr5,634.40
DH1,011.98
List Price:  DH1,416.82
You save:  DH404.83
L1,789.85
List Price:  L2,505.87
You save:  L716.01
ден5,767.34
List Price:  ден8,074.51
You save:  ден2,307.16
MOP$804.17
List Price:  MOP$1,125.87
You save:  MOP$321.70
N$1,897.84
List Price:  N$2,657.05
You save:  N$759.21
C$3,669.73
List Price:  C$5,137.77
You save:  C$1,468.04
रु13,346.58
List Price:  रु18,685.75
You save:  रु5,339.16
S/375.13
List Price:  S/525.19
You save:  S/150.06
K378.96
List Price:  K530.57
You save:  K151.60
SAR375.09
List Price:  SAR525.14
You save:  SAR150.05
ZK2,519.95
List Price:  ZK3,528.03
You save:  ZK1,008.08
L466.17
List Price:  L652.66
You save:  L186.48
Kč2,369.01
List Price:  Kč3,316.71
You save:  Kč947.70
Ft36,915.02
List Price:  Ft51,682.51
You save:  Ft14,767.48
SEK kr1,089.22
List Price:  SEK kr1,524.96
You save:  SEK kr435.73
ARS$86,913.85
List Price:  ARS$121,682.87
You save:  ARS$34,769.02
Bs690.45
List Price:  Bs966.66
You save:  Bs276.20
COP$391,130.80
List Price:  COP$547,598.77
You save:  COP$156,467.96
₡49,957.95
List Price:  ₡69,943.14
You save:  ₡19,985.18
L2,461.44
List Price:  L3,446.12
You save:  L984.67
₲737,867.79
List Price:  ₲1,033,044.43
You save:  ₲295,176.63
$U3,889.78
List Price:  $U5,445.86
You save:  $U1,556.07
zł405.87
List Price:  zł568.23
You save:  zł162.36
Already have an account? Log In

Transcript

Hello, in this video we are going to cover headers and footers inside your code, because at the moment, we just open up our website. Go to our code, go to Image list group, I'm going to block some text and a button. But what you can do is add a header and a photo which has a bit of styling, a bit of a background color, and a few extra pieces done that just makes it pop. So if you have different types of cars on your website, you can easily add a header maybe they're actually like a blog post. So that way, you could even put this title inside the header and the footer could just have some last leaving notes or it could have some for a copyright information. Those are just some examples but you can obviously do what you want with them.

And to other headaches. Go to the top of your card and add a div either class of called down header. And then inside you simply put whatever text you want. So I'm just gonna put a header just to keep it simple. Save that. I'm gonna add a footer one I'm here.

So try to go to the end of the card and add a div with a class of thinking asset card, dash footer. So the app or wherever you want, could import image or guest for whatever you want, but I was going to keep seeing point is have a bit of text inside it, refresh, and there you go. We've got our header and we've got our footer, you might be thinking look very good on the left, especially when there's other items aligned to the right enter the center. And just like you do anything else, you can easily add some alignment song and put text dash center and text. For this one, we'll put text dash ROI so text dash, right Save that refresh. So we've got the center.

And we've got that on the right. bootstrap also offers a nother class. You could text us muting, which is really suited to the footer for the show up and refresh. I think the color is slightly gray hair. So it's just, I personally think he just looks a little better because a lot of the time the footer is generally not going to be interacting with something like this log is a bit of copyright information. You might not want it as bold or as upfront as a lot of the other items.

So you can just put text dash muted, but that's it for headers and footers we've caught it's really simple. If you have any questions, feel free to post them on our education platform sonar learning coda UK for slash question dot php. There'll be a link in the description to that, but also we've got thousands of videos for free on that. platforms, check them out as well. Please rate, comment and subscribe. We'll also have another link in the description to the source code from this video.

And as usual, thanks for watching and I hope you have a great day.

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.