1、打开HBuilderX工具,在已新建的Web项目中,新建静态页面center.html
2、打开已创建的页面文件,修改title标签内容,并引入相关的js文件
3、在<body></body>标签中,插入一个父子嵌套的di箪滹埘麽v标签,分别设置id值为father和son
4、在style标签中,利用ID选择器设置父子div标签的样式,如宽度、边框、字体属性、背景色等
5、保存代码并运行项目,打开Firefox浏览器,查看到文字内容还是居左显示
6、接着在子div标签样式中添加一个margin:auto 0,然后保存代码
7、再次刷新火狐浏览器,可以发现文字内容居中显示(相对于父div元素)