Computer Screens, Printers, Cameras, and most anything that needs to interpret digital images and their colours use a colour profile.
The intention of colour profiles was to solve the problem of 'What happens if this screen's attempt to produce a pure red differs slightly from this other screen's attempt to produce a pure red'? They both think they're showing the same colour but our eyes tell us otherwise. They may have been manufactured differently or used less accurate components, etc.
Colour profiles attempt to set objective, measured standards that have been recorded into a file that screens, printers, scanners, cameras, etc. can understand. That's the theory anyway, and I'll leave that explanation there as it will only digress.
Your screen has a colour profile that's slightly adjusting the colours it's being told to display. The css hex colour is showing you what the author intended to display and the system colour picker is showing you what your computer thinks this colour should be shown as on your particular screen. Your eyes are the only thing showing you what it is displaying (well... that's up for debate). Hope that makes sense.
In regards to your end question: If you want to retrieve the original hex colour - as set by the author - by means of an eye-dropper tool I would use one of the many colour picking plugins available for Chrome. Search the Chrome Web-Store and see which one suits your needs. I believe most will return the hex colour in the manner you desired.