As ralph mentioned 'responsive' is a term to describe a layout that changes, usually drastically at specific screen sizes. This is not to be confused with 'fluid' whcih merely adjusts. 'responsive' design usually employ CSS3 media queries.
'grids' are just that 'grids'. similar to the concept in print design you design around an imaginary set of coulms.
for example: you could have a 8 col. grid. each col being 120px wide for a total of 960px
When you lay your elements out in a row you could have the following:
row 1 head: (2col) ( 4 col) (2 col )
row 2 content : (4col) ( 4 col)
row 3 footer : (2col) ( 2 col) ( 2 col) ( 2 col)
This is not only great aesthetically, but can serve for responsive layouts since you can do a little math and rearrange the layout w/o changing the size of the components . lets say only had a 480px screen you could rearrange the above this way (going from 8 col to 4 col grid) :
row 1 head: (2col)(2 col )
row 2 head: ( 4 col)
row 3 content : (4col)
row 4 content : (4col)
row 5 footer : (2col) ( 2 col)
row 6 footer : (2col) ( 2 col)
hope that helps