生活职场趣事分享 发表于 2019-7-10 15:18:24

想看懂网站源代码里面的代码吗?看了你就懂了

这章我们照旧用《SEO需要会用的HTML代码都有什么》这章网站的源代码作为列子,没看过的朋友们呢可以在小编的文章里面找下,这章我本人将分析这个列子里面所有的源代码。
https://p3-sign.toutiaoimg.com/dfic-imagehandler/9ad2a7b3-8907-49e2-afc9-da34ecb5f1c0~tplv-tt-large.image?x-expires=1970206987&x-signature=%2FPatUBAmqUIVhQf%2FHfZbGv74z6s%3D


图片里面我们可以看到啊这是HTML标签的一个头部head,《SEO需要会的HTML代码》这章讲过DOCTYPE命名和空间,字符编码的声明TDK,下面接着讲剩下的内容,这串代码的文件路径是蓝色可以点开的,这里是这个网站的LOGO图案,这个是一个css的外部样式表点开是这个网站的一个CSS样式好比字体高度宽度样式按钮页面结构都在里面可以理解为是一个CSS库图片如下:
https://p3-sign.toutiaoimg.com/pgc-image/1283c07a48f946929658d00faf4175ad~tplv-tt-large.image?x-expires=1970206987&x-signature=DugZYPeR3Eo6vhp%2B7NjwHYCec7M%3D



这串代码点开是JS的事件,
// JavaScript Document function urlredirect() {var sUserAgent = navigator.userAgent.toLowerCase();if ((sUserAgent.match(/(ipod|iphone os|midp|ucweb|android|windows ce|windows mobile)/i))) {// 盛千网络的跳转var thisUrl = window.location.href;window.location.href = 'http://www.gylrshl.com/3g';urlrediurlredirect();在浏览器中,与用户进行数据互换都是通过客户端的
javascript代码来实现的,而完成这些交互工作大多数是document对象及其部件进行的,因此document对象是一个比较重要的对象。
下面是网站的顶部结构导航页如图
https://p3-sign.toutiaoimg.com/pgc-image/8f4d81ff43fb4d1c9b3b8d25c4c884c0~tplv-tt-large.image?x-expires=1970206987&x-signature=lkDr16wy8D03Kyqq45n01Fzwyzo%3D


进入文章的body部门,<div class="t_bg"><div class="header"><div class="h_top">首先声明顶部贵州科阳之星金属制品有限公司官网欢迎您!如图
在线咨询

|关于我们
接洽我们

网站舆图
这串代码是对应的网站右边顶部导航栏上面的关于我们 在线咨询 接洽我们 网站舆图</p>https://p3-sign.toutiaoimg.com/pgc-image/933cf37411b44e7ba7fdc9dc624b2130~tplv-tt-large.image?x-expires=1970206987&x-signature=0Odp8cbG4KVqOqgO1Fm2j1sw6Ls%3D


<div class="h_con">http://www.wxcydz.cc/twcms/view/default/images/logo.jpg

这一行代码是网站的标题的笔墨和插入的LOGO标识,
公司名字我们省略
刘司理咨询热线:接洽方式我们省略
这串代码是网站标题右边的接洽方式。
div class="hot_nav"><div class="h_nav"><ul><li class="cur"><a href="http://www.gylrshl.com/" target="_blank" title="网站首页">如下图
https://p3-sign.toutiaoimg.com/pgc-image/325118fa78394256a8ab903937cf293e~tplv-tt-large.image?x-expires=1970206987&x-signature=lA7HFW6PhuVOxt%2Bikk1%2BNtOX4VY%3D
这个导航是用的有序列表加上可跳转的a标签写的,很简朴,我们跳过。
这里是设置导航的宽度,配景致的添补和跳转。
由于时间缘故起因,小编先更到导航栏这里,剩下篇幅,后续在更,大家不见不散。

看明白不点破 发表于 2019-7-10 16:56:04

无语 有毛病
页: [1]
查看完整版本: 想看懂网站源代码里面的代码吗?看了你就懂了