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
€96.21
List Price:  €134.70
You save:  €38.49
£79.93
List Price:  £111.90
You save:  £31.97
CA$143.79
List Price:  CA$201.32
You save:  CA$57.52
A$160.48
List Price:  A$224.69
You save:  A$64.20
S$135.83
List Price:  S$190.17
You save:  S$54.33
HK$777.07
List Price:  HK$1,087.93
You save:  HK$310.86
CHF 89.45
List Price:  CHF 125.24
You save:  CHF 35.78
NOK kr1,141.95
List Price:  NOK kr1,598.78
You save:  NOK kr456.82
DKK kr717.64
List Price:  DKK kr1,004.72
You save:  DKK kr287.08
NZ$177.52
List Price:  NZ$248.53
You save:  NZ$71.01
د.إ367.25
List Price:  د.إ514.17
You save:  د.إ146.91
৳11,994.74
List Price:  ৳16,793.12
You save:  ৳4,798.37
₹8,496.63
List Price:  ₹11,895.62
You save:  ₹3,398.99
RM450.75
List Price:  RM631.07
You save:  RM180.32
₦155,628.43
List Price:  ₦217,886.03
You save:  ₦62,257.60
₨27,934.96
List Price:  ₨39,110.06
You save:  ₨11,175.10
฿3,444.45
List Price:  ฿4,822.37
You save:  ฿1,377.92
₺3,518.54
List Price:  ₺4,926.10
You save:  ₺1,407.55
B$617.53
List Price:  B$864.57
You save:  B$247.04
R1,837.80
List Price:  R2,572.99
You save:  R735.19
Лв188.31
List Price:  Лв263.64
You save:  Лв75.33
₩144,872.25
List Price:  ₩202,826.95
You save:  ₩57,954.69
₪364.89
List Price:  ₪510.86
You save:  ₪145.97
₱5,883.01
List Price:  ₱8,236.45
You save:  ₱2,353.44
¥15,672.80
List Price:  ¥21,942.55
You save:  ¥6,269.75
MX$2,028.91
List Price:  MX$2,840.56
You save:  MX$811.64
QR366.34
List Price:  QR512.89
You save:  QR146.55
P1,382.59
List Price:  P1,935.69
You save:  P553.09
KSh12,923.70
List Price:  KSh18,093.70
You save:  KSh5,170
E£5,091.27
List Price:  E£7,127.98
You save:  E£2,036.71
ብር12,764.56
List Price:  ብር17,870.89
You save:  ብር5,106.33
Kz91,790.82
List Price:  Kz128,510.82
You save:  Kz36,720
CLP$99,155.08
List Price:  CLP$138,821.08
You save:  CLP$39,666
CN¥729.81
List Price:  CN¥1,021.77
You save:  CN¥291.95
RD$6,104.52
List Price:  RD$8,546.58
You save:  RD$2,442.05
DA13,454.60
List Price:  DA18,836.98
You save:  DA5,382.37
FJ$232.11
List Price:  FJ$324.96
You save:  FJ$92.85
Q773.21
List Price:  Q1,082.52
You save:  Q309.31
GY$21,000.46
List Price:  GY$29,401.48
You save:  GY$8,401.02
ISK kr13,903.60
List Price:  ISK kr19,465.60
You save:  ISK kr5,562
DH1,007.40
List Price:  DH1,410.40
You save:  DH403
L1,841.78
List Price:  L2,578.57
You save:  L736.78
ден5,922.50
List Price:  ден8,291.74
You save:  ден2,369.23
MOP$803.42
List Price:  MOP$1,124.82
You save:  MOP$321.40
N$1,834.70
List Price:  N$2,568.66
You save:  N$733.95
C$3,694.32
List Price:  C$5,172.20
You save:  C$1,477.87
रु13,665.58
List Price:  रु19,132.35
You save:  रु5,466.77
S/374.71
List Price:  S/524.60
You save:  S/149.89
K406.86
List Price:  K569.63
You save:  K162.76
SAR375.72
List Price:  SAR526.02
You save:  SAR150.30
ZK2,777.96
List Price:  ZK3,889.25
You save:  ZK1,111.29
L478.81
List Price:  L670.35
You save:  L191.54
Kč2,418.25
List Price:  Kč3,385.65
You save:  Kč967.40
Ft39,800.47
List Price:  Ft55,722.25
You save:  Ft15,921.78
SEK kr1,103.66
List Price:  SEK kr1,545.17
You save:  SEK kr441.50
ARS$102,190.76
List Price:  ARS$143,071.15
You save:  ARS$40,880.39
Bs693.61
List Price:  Bs971.08
You save:  Bs277.47
COP$437,799.12
List Price:  COP$612,936.28
You save:  COP$175,137.16
₡50,480.33
List Price:  ₡70,674.48
You save:  ₡20,194.15
L2,548.03
List Price:  L3,567.35
You save:  L1,019.31
₲784,126.06
List Price:  ₲1,097,807.85
You save:  ₲313,681.79
$U4,460.41
List Price:  $U6,244.75
You save:  $U1,784.34
zł409.96
List Price:  zł573.96
You save:  zł164
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.