发表于: 2019-05-28 21:56:00
2 731
今天完成的事情:1 将自己的ps的cs6版本更换为2019cc版,并成功将背景图切了下来
2 已大致完成任务5.1的布局,并将table布局全部换位div+css完成
明天计划的事:1 将任务5的布局尽量以flex布局完成,提升熟练度
2 将任务5提交
遇到的问题:1 在刚开始看到任务页面的时候,就下意识的觉得在“技能介绍”部分最佳方案是使用table布局,
但是在查找资料的时候发现,大家基本上都在推荐div+css的布局,反复强调table布局已经落伍了。
后来我就开始查找关于table布局和div+css布局的优劣。
首先,关于使用table布局的特点
优点:
1、对于新手而言,容易上手,尤其对于一些布局中规中矩的网页,更让人首先想到excel,进而通过使用table去实现它。
2、表现上更加“严谨”,在不同浏览器中都能得到很好的兼容
3、通过复杂的表格套表格的形式,也可以实现比较复杂的布局需求。布置好表格,然后将内容放进去就可以了。
4、它可以不用顾及垂直居中的问题。
5、数据化的存放更合理。
缺点:
1、标签结构多,复杂,在表格布局中,主要是用到表格的相互嵌套使用,这样就会造成代码的复杂度更高!
2、表格布局,不利于搜索引擎抓取信息,直接影响到网站的排名
其次,关于使用div+css布局的特点
优点
1、符合W3C标准的,W3C标准提出网页由三部分组成:结构(Structure)、表现(Presentation)和行为(Behavior)。结构清晰明了,结构、样式和行为分离,带来足够好的可维护性。
2、布局更加灵活多样,能够通过样式选择来实现界面设计方面的更多要求。
3、布局改版方便,不需要过多地变动页面内容,通常只要更换相应的css样式就可以将网页变成另外一种风格展现出来。
4、布局可以让一些重要的链接和文字信息等优先让搜索引擎抓取,内容更便于搜索。
5、增加网页打开速度,增强用户体验。
缺点
1、开发技术高,要考虑兼容版本浏览器。目前来看,DIV+CSS还没有实现所有浏览器的统一兼容。
2、CSS网站制作的设计元素通常放在1个外部文件中,或几个文件,
有可能相当复杂,甚至比较庞大,如果CSS文件调用出现异常,那么整个网站将变得惨不忍睹。
最后, div+css的布局较table布局的明显优势
1,其实也是div+css布局的第一个特点,table标签被严格地定义为存放数据的一个区域,而不是布局工具,它的布局形式不符合W3C标准,没有实现结构和表现的分离,它既有css的表现功能,也有html的结构功能。
2,table布局加载网页时,必须整体加载完,降低了网页的呈现速度,而div+css布局是边加载边显示的。
3,table布局在网页代码编写时,有时需要嵌套多重表格才能实现,但使用div+css布局,相对而言会减少许多嵌套时的代码,更容易检查和维护。
4,table布局不方便表现的更换,使用div+css布局,大多只要更改css样式表就能变化表现形式。
5、易于维护和改版。
链接:https://www.jianshu.com/p/cc15d92f6e42
2 关于notepad++上面批量处理元素的方法:(1)首先打开notepad++,并找到”搜索“然后进入(2)比如说我要将文件内的td全部替换
为div,那么我就在”查找目标“这个框里输入td,在“替换为”中输入div,并将“查找模式”改为”正则表达式“即可,效果图如下
评论