为什么html元素的宽度未设置为页面的100％？

I'm in the beginning of HTML and CSS and I'm stuck in the layout area and position things, One of the most confusing things I face is: the html width is related to the width of its child, By inspecting element in the browser its width changes along with the width of its child. Although when I apply linear gradient to it (html) and draw a border around it, the border surround just that inherited width (from the child!!), but the gradient applied to the full page and outside the border, as it applied to the margin!! the most confusing:: that gradient width is equal to the width of the (say div element inside the body) and is repeated for the whole page! What's going on?!I'm in the beginning of HTML and CSS and I'm st