HTML5和CSS3是現代前端開發不可缺少的重要技術，其中運動效果更是前端開發必不可少的一部分。HTML5和CSS3提供了許多動畫效果和過渡效果，使得網頁設計更具有生動的視覺效果。

/* CSS3運動效果代碼 */
div{
animation: mymove 3s infinite;
transition: all 1s;
}
@keyframes mymove{
0%{left:0px;}
50%{left:200px;}
100%{left:0px;}
}

CSS3的動畫效果可以通過關鍵幀方式使用keyframes進行定義。在定義每個關鍵幀時，可以設置相應的CSS屬性，通過動畫過程，瀏覽器可自動計算相應屬性的變化并進行動畫渲染。

而CSS3的過渡效果是通過transition屬性實現的，在CSS屬性改變時，可實現平滑的過渡過程。可以使用all屬性表示所有CSS屬性均需要過渡，或只使用單個CSS屬性進行過渡。

/* HTML5的canvas運動效果代碼 */
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.moveTo(0, 0);
ctx.lineTo(400, 200);
ctx.moveTo(0, 200);
ctx.lineTo(400, 0);
ctx.strokeStyle = "#FF0000";
ctx.stroke();

HTML5提供的canvas技術可以實現更為復雜的運動效果。在canvas中，使用JavaScript腳本繪制圖形，從而實現更為細致的表現，可以展現更多的動態效果。

總的來說，HTML5和CSS3是現代網頁開發不可或缺的技術，可以通過它們提供的各種動畫效果和過渡效果實現更加豐富的頁面設計和動態展示。