Nie wiem jak osiągnąć efekt nieinwazyjnego obramowania elementów po najechaniu na nie myszką. Elementami tymi może być zarówno img, div, span, h1, p itd...

Tzn. jeżeli najadę na dowolny element myszką zostanie mu dodane obramowanie, które nie zmieni parametrów takich jak rozmiar czy marginesy. Czyli element zostanie nie tknięty, oczywiście gdy kursor myszki zejdzie z obiektu obramowanie zniknie. Nie mam najmniejszego pojęcia jak tego poszukać więc proszę o pomoc. Zastanawiam się tylko czy można to rozwiązać w czystym css-ie czy może potrzebny będzie kod javascript (wskazane by było jquery).

Z góry dziękuję za pomoc!

Chyba chodzi Ci o 'box-sizing', ale to jest kwestia CSS3. Sam zobacz:
http://www.css3.info/preview/box-sizing/

Wystarczy dodać do elementu 'box-sizing:border-box;', ale nie wiem ile przeglądarek to teraz obsługuje.

W CSS2 możesz zrobić przykładowo coś takiego (załóżmy, że zmieniasz obramowanie pewnego DIVa) i efekt będzie podobny:

[CSS] pobierz, plaintext 
DIV {
     padding:10px;
}
DIV:hover{
     border:1px solid #000;
     padding:9px;
}
[CSS] pobierz, plaintext