H5网页布局+css代码美化,零基础参考

HTML5的结构化标签,对搜索引擎更友好

li 标签对不利于搜索引擎的收录,尽量少用

banner图片一般拥有版权,不需要搜索引擎收录,因此可以使用ul + li

可用于浅色副标题

display:inline-block; 每个导航块存在水平间隙,解决方法是在父元素上添加font-size:0;


sublime安装csscomb插件

选中css代码,ctrl+shift+c 自动整理好代码

排序前:

排序后:

此时存在多余的空行

解决方法:

安装cssformat插件,对代码执行edit->cssformat->expanded 即可删除空行


选中单句样式前面的空白部分(即tab空位)

然后alt+f3 会统一选中所有tab留白

按一次删除,再按一次删除,再空一格

此时这个效果:

然后按向下箭头,按向左箭头,按删除一次,再加个空格

此时效果

再向下箭头,再删除

此时效果

css样式代码美化完毕。

新标签元素的浏览器兼容解决:

header,nav,section,aside,article,footer{display: block;}

最后晒出所有代码

index.html





Document



    

右边标题

这是右边文章内容哦~

这是右边文章内容哦~

原文链接:,转发请注明来源!