At present,many web layouts of ten use a single floating layout or positioning layout technology.Both have advantages and disadvantage:floating layout can flexibly achieve a variety of page layout,but can not precisely control the position of the element;positioning layout makes the element appear in the specified precise location.In order to realize flexible layout and precise positioning of elements,this paper puts forward the technology of combining floating layout and positioning layout,which can complete complex page layout more simply and effectively.This paper first analyzes the types of page layout,then studies the basic principles of page floating and positioning layout,and finally expounds on the combined application of floating and positioning layout through a case,which provides a reference for learning web layout technology.