• 关于

    HTML中的页面结构

    的搜索结果

问题

为什么jq在chrome中无法在主页面访问 iframe 中所加载的页面里面的内容,放在服务器上却可以访问

小旋风柴进 2019-12-01 19:28:13 956 浏览量 回答数 1

回答

web标准简单地说可以可以分为结构,表现和行为。其中结构主要是有HTML标签组成。或许通俗点说,在页面body里面我们编写的标签都是为了页面的结构。表现即指css样式表,通过css可以是页面的结构标签对准美感。行为是指页面和用户具有一定的相互作用,同时页面结构或者表现发生变化,主要是有js组成。 但通常产生行为时,就会有结构或表现的变化,也使这三者的界限并不那么清晰。 W3C对网络标准提出了规范化的要求,也就是在实际编程中的一些代码规范:包含如下几点 1.对于结构要求:(标签规范可以提高搜索引擎对页面的抓取效率,对SEO很有帮助) 1)标签字母要小写 2)标签要封闭 3)标签随意随意嵌入 2.对于css和js来说 1)尝试使用外链css样式表和js脚本。是结构,表现和行为分为三块,符合规范。同时提高页面渲染速度,提高用户的体验。 2)样式尽量少用行间样式表,使结构与表现分离,标签的id和类等属性命名要做到见文知义,标签越少,加载越快,用户体验提高,代码维护简单,方便改版 3)不需要移动页面内容,可以提供打印版本而不需要复制内容,提高网站易用性。

茶什i 2019-12-02 03:16:03 0 浏览量 回答数 0

回答

什么是 FOUC?如何避免 什么是 Fouc(文档样式短暂失效)? 在引用 css 的过程中,如果方法不当或者位置引用不对,会导致某些页面在 windows 下的 ie 出现一些奇怪的现象,以无样式显示页面内容的瞬间闪烁,这种现象称之为文档样式短暂失效,简称 FOCU。 原因大致为: 使用 import 方法导入样式表 将样式表放在页面底部 有几个样式表,放在 html 结构的不同位置。 其实原理很清楚:当样式表晚于结构性 html 加载,当加载到此样式表时,页面将停止之前的渲染。此样式表被下载和解析后,将重新渲染页面,也就出现了短暂的花屏现象。 解决方法:使用 link 标签将样式表放在文档 head 中。

茶什i 2019-12-02 03:16:48 0 浏览量 回答数 0

阿里云试用中心,为您提供0门槛上云实践机会!

0元试用32+款产品,最高免费12个月!拨打95187-1,咨询专业上云建议!

回答

Tomcat服务器中使用WAR包来部署应用时,WAR包的项目结构必须符合一定的标准,一个Web项目目录中包含Web应用程序代码和配置文件以及静态文件等。 项目文件夹结构 为了简化工程的编译和打包步骤,推荐使用下面的项目文件层次结构。 tomcat-webapp └── src └── main ├── java - 源代码目录 │ └── com │ └── demoapp │ └── Hello.java ├── resources - 资源配置文件 │ └── application.properties └── webapp ├── 404.jsp - 404jsp页面 ├── WEB-INF - 安全目录 │ ├── classes - 已编译的类 │ ├── lib - jar库文件 │ │ └── mysql-connector-java-8.0.8-dmr.jar │ ├── views - 页面模板 │ │ └── index.mustache │ └── web.xml - 部署描述文件 ├── index.jsp - jsp页面 └── static - 静态资源文件 ├── css - css样式资源文件 │ └── demoapp.css ├── fonts - 字体资源文件 ├── images - 图像资源文件 │ └── demoapp.png └── js - JavaScript文件 └── bootstrap.min.js src/main/java目录下的内容包含您开发的应用程序,即未编译的java类文件,这些类将被编译成可通过应用程序代码访问的.class文件并置于src/main/webapp/WEB-INF/classes目录中。java类文件编译完成后,编译好的class文件将被置于webapp/WEB-INF/classes中,并与webapp目录一并被打包部署到服务器上。 webapp根目录文件夹结构 webapp的根目录中存储了html页面,jsp页面以及静态资源等内容,这些内容将与WEB-INF一起被打包部署到服务器上。 webapp中除了WEB-INF外的其他内容可通过客户端直接访问,如404.jsp页面和index.jsp页面。static目录中存放css样式文件,图片文件和JavaScript文件等可由客户端访问的资源。 webapp ├── 404.jsp ├── WEB-INF ├── index.jsp └── static ├── css │ └── demoapp.css ├── fonts ├── images │ └── demoapp.png └── js └── bootstrap.min.js WEB-INF子目录文件夹结构 webapp目录下的WEB-INF的子目录,该子目录一般包含如下文件和目录,WEB-INF是Java的WEB应用的安全目录,其中的资源客户端无法直接访问,服务端可以访问的目录中的内容,其中有如下内容: classes目录中包含了您开发的应用程序源码编译后的.class文件; lib目录中包含了web应用需要依赖的各种JAR文件,如数据库驱动jar文件; 页面模板文件(如mustache文件); web.xml应用配置文件。 WEB-INF ├── classes -已编译的类 ├── lib - jar库文件 ├── views - 页面模板 └── web.xml - web应用配置文件

1934890530796658 2020-03-23 14:14:56 0 浏览量 回答数 0

问题

html5标签语义化 (section article)到底该如何应用

杨冬芳 2019-12-01 20:01:09 819 浏览量 回答数 1

回答

单页应用的优点与缺点相比传统的开发方式,单页应用有如下几方面的显著优点:页面切换速度快。视觉上页面的切换,只是技术上同一页面两个区块之间的切换页面之间的可传递所有js支持的数据类型,甚至是一个DOM元素可为页面切换过程添加转场动画与此同时,单页应用也存在如下几方面的缺点:所有页面的样式、DOM和JS需要完全加载页面打开速度稍慢对于缺点1,开发者可借助如下手段解决或优化:借助gulp.js等构建工具,将所有视图的样式、DOM结构和脚本分别合并之单独的文件中压缩,以降低影响。以复杂类型中等的电商为例,如果一个界面含有80个视图,那么通过构建工具合并压缩之后的脚本也只有1.1M左右拆解客户端功能,仅将共属于同一操作范畴的视图构建至同一html中。不同操作范畴的视图隶属于不同html文件对于缺点2,开发者可以通过配置web服务器,为页面加上缓存控制,从而降低影响,使得页面的第二次及其后的加载速度更快。

wangccsy 2019-12-02 01:40:40 0 浏览量 回答数 0

问题

最有效率的网站前端开发流程?:报错

kun坤 2020-06-14 08:53:17 0 浏览量 回答数 0

回答

按规范 除此之外,也可以使用单独的 .css 文件,通过 引入页面, 也应该放置在 内的。之所以放head中, 是因为浏览器解析html文档是自上而下的,如果放底部的话,页面结构出来了,css还没开始渲染,不然的话网页就会这样:

杨冬芳 2019-12-02 02:32:33 0 浏览量 回答数 0

回答

每个Activity对应的视图结构相当于html的DOM树,不同的Activity视图(html页面)中出现相同的id不会有干扰~

爵霸 2019-12-02 02:36:15 0 浏览量 回答数 0

问题

【分享】WeX5的正确打开方式(2)

小太阳1号 2019-12-01 21:17:14 3935 浏览量 回答数 1

回答

简述重排的概念 浏览器下载完页面中的所有组件(HTML、JavaScript、CSS、图片)之后会解析生成两个内部数据结构(DOM 树和渲染树),DOM 树表示页面结构,渲染树表示 DOM 节点如何显示。重排是 DOM 元素的几何属性变化,DOM 树的结构变化,渲染树需要重新计算。 简述重绘的概念 重绘是一个元素外观的改变所触发的浏览器行为,例如改变 visibility、outline、背景色等属性。浏览器会根据元素的新属性重新绘制,使元素呈现新的外观。由于浏览器的流布局,对渲染树的计算通常只需要遍历一次就可以完成。但 table 及其内部元素除外,它可能需要多次计算才能确定好其在渲染树中节点的属性值,比同等元素要多花两倍时间,这就是我们尽量避免使用 table 布局页面的原因之一。 简述重绘和重排的关系 重绘不会引起重排,但重排一定会引起重绘,一个元素的重排通常会带来一系列的反应,甚至触发整个文档的重排和重绘,性能代价是高昂的。 什么情况下会触发重排? - 页面渲染初始化时;(这个无法避免) - 浏览器窗口改变尺寸; - 元素尺寸改变时; - 元素位置改变时; - 元素内容改变时; - 添加或删除可见的 DOM 元素时。 重排优化有如下五种方法 - 将多次改变样式属性的操作合并成一次操作,减少 DOM 访问。 - 如果要批量添加 DOM,可以先让元素脱离文档流,操作完后再带入文档流,这样只会触发一次重排。(fragment 元素的应用) - 将需要多次重排的元素,position 属性设为 absolute 或 fixed,这样此元素就脱离了文档流,它的变化不会影响到其他元素。例如有动画效果的元素就最好设置为绝对定位。 - 由于 display 属性为 none 的元素不在渲染树中,对隐藏的元素操作不会引发其他元素的重排。如果要对一个元素进行复杂的操作时,可以先隐藏它,操作完成后再显示。这样只在隐藏和显示时触发两次重排。 - 在内存中多次操作节点,完成后再添加到文档中去。例如要异步获取表格数据,渲染到页面。可以先取得数据后在内存中构建整个表格的 html 片段,再一次性添加到文档中去,而不是循环添加每一行。

茶什i 2019-12-02 03:19:56 0 浏览量 回答数 0

回答

div是一个HTML标签,css是一种样式语言,在HTML中通常使用div元素来搭建出页面基本结构,再使用css来布局和书写样式。div + css是一种很常用的网页制作方式.

micro0 2019-12-02 00:57:40 0 浏览量 回答数 0

回答

一般情况下,当你决定引入某个框架的时候,就需要以这个框架的样式表为主,并在此基础上做一些细节调整。换句话说,你的 style.css 恐怕得改改了。当然,也可以考虑改 bootstrap 的源文件中的样式,但是不建议改结构,只改一些配色啊,边框效果啊之类的还是可以的,改结构可能引起布局混乱。如果你需要在一个页面中不同的地方使用两个样式表,可以考虑按区域加个限定,当然这种情况下最好是改你自己的 style.css,把它在 bootstrap 的样式表之后引入,比如原来的a {} .abcd {}加个限定(同时需要在HTML中加个 DIV.mime 包起来(我写的LESS,方便看层次关系)// less file .mine { a {} .abce {} }

杨冬芳 2019-12-02 02:38:51 0 浏览量 回答数 0

问题

CSS问题:请问如何做到CSS样式能够尽量的重用?

杨冬芳 2019-12-01 19:42:52 887 浏览量 回答数 1

问题

两个html页面引入同一个js文件,如何共享一个变量?

a123456678 2019-12-01 20:24:42 1621 浏览量 回答数 1

回答

看情况和项目要求json方便操作(client/server),传输的数据简洁,缺点是缺少了自解释性,单给你一个json结构你不造是干嘛玩意儿的。XML 自解释性强,格式统一符合标准。正是因为有了自解释性多出了很多额外属性或头尾,因此占用资源('带宽/解析')会大一些。html 这个比较特殊,很少会以html格式数据作为交互。不是不可以,只是没有必要。数据交互过程中一般情况比较单纯,只交互数据,尽量减少数据大小和贷款资源占用,什么时候会返回html?直接由服务器渲染页面的时候才会。问题中问的是ajax交互。那么个人觉得html没必要列在这里了。

a123456678 2019-12-02 03:15:53 0 浏览量 回答数 0

问题

上传文件问题(iframe方式)

杨冬芳 2019-12-01 20:05:51 1392 浏览量 回答数 1

问题

web页面画图 并保存到服务器端 时间紧 求现有的库

a123456678 2019-12-01 20:21:09 1025 浏览量 回答数 1

问题

前端小白入门HTML基础 【新手百问合集】

马铭芳 2019-12-01 20:09:03 2532 浏览量 回答数 4

回答

有很多可能性会引入strong,比如用户输入内容里面有未关闭的strong等。 建议排查步骤:1.在后端,渲染视图后,打断点看看输出的HTML有没有strong如果没有strong,进入2。这一步是看后端输出的HTML有没有带上没有处理好的strong。2.在浏览器中右键,选择“查看网页源代码”,这样可以看到浏览器接收到的HTML源码,没有JS干预。 如果没有strong,进入3。diff 1和2的结果,可以看HTML有没有在传输过程被篡改。3.在chrome里你的页面中按F12,在你需要查看的共有父级上面右击(比如文档结构是#container > strong > #inner那么就在#container上面右击),选择"break on..."->"subtree modifications",再次刷新,即可在JS改变这部分文档树的时候暂停。 这样可以知道是否是在JS中(自己的代码,被劫恶意嵌入的js代码,浏览器插件等)修改了这部分文档。

杨冬芳 2019-12-02 02:50:04 0 浏览量 回答数 0

问题

如何加快网站访问速度

小柒2012 2019-12-01 21:00:27 13013 浏览量 回答数 9

回答

浮动元素引起的问题: 1. 父元素的高度无法被撑开,影响与父元素同级的元素 2. 与浮动元素同级的非浮动元素会跟随其后 3. 若非第一个元素浮动,则该元素之前的元素也需要浮动,否则会影响页面显示的结构 解决方法: 使用 CSS 中的 clear:both; 属性来清除元素的浮动可解决2、3问题,对于问题1,添加如下样式,给父元素添加clearfix样式: 清除浮动的几种方法: 1. 额外标签法, (缺点:不过这个办法会增加额外的标签使HTML结构看起来不够简洁。) 2. 使用after伪元素 浮动外部元素设置 overflow 为 hidden 或者 auto

小柯卡力多 2019-12-02 03:21:59 0 浏览量 回答数 0

回答

白屏时间=页面开始展示的时间点-开始请求时间点。 开始请求时间点可以通过Performance Timing.navigation Start 。那么页面开始展示的时间点怎么获取呢。已经知道渲染过程是逐步完成的,而且页面解析是按照文档流从上至下解析的,因此一般认为开始解析body的时间点就是页面开始展示的时间。所以可以通过在head标签的末尾插入script来统计时间节点作为页面开始展示时间节点。但是这种方式需要打点,因此也有很多项目为了简化白屏时间的获取会选择忽略head解析时间直接用Performance Timing.dom Loading 来表示页面开始展示的时间,即使用domloading-navigation Start来表示白屏时间。 首屏时间=首屏内容渲染结束时间点-开始请求时间点。 同样开始请求时间点可以通过Performance Timing.navigation Start获取。首屏内容渲染结束的时间点通常有以下几种方法获取: (1)首屏模块标签标记法 适用于于首屏内容不需要通过拉取数据才能生存以及页面不考虑图片等资源加载的情况。通过在 HTML 文档中对应首屏内容的标签结束位置,使用内联的 JavaScript 代码记录当前时间戳作为首屏内容渲染结束的时间点。 (2)统计首屏内加载最慢的图片的时间 通常首屏内容加载最慢的就是图片资源,因此可以把首屏内加载最慢的图片加载完成的时间作为首屏时间。由于浏览器对每个页面的 TCP 连接数有限制,使得并不是所有图片都能立刻开始下载和显示。因此在 DOM树 构建完成后会通过遍历首屏内的所有图片标签,并且监听所有图片标签 onload 事件,最终遍历图片标签的加载时间获取最大值,将这个最大值作为首屏时间。 (3)自定义首屏内容计算法 由于统计首屏内图片完成加载的时间比较复杂。所以在项目中通常会通过自定义模块内容,来简化计算首屏时间。例如忽略图片等资源加载情况,只考虑页面主要 DOM;只考虑首屏的主要模块,而不是严格意义首屏线以上的所有内容。 可交互时间=用户可以正常进行事件输入时间点-开始请求时间点。 PerformanceTiming有一个domInteractive属性,代表了DOM结构结束解析的时间点,就是Document.ready State属性变为“interactive”

游客p7wlo4q4jr4va 2020-05-23 12:54:57 0 浏览量 回答数 0

问题

搞懂了这几点,你就学会了Web编程

技术小菜鸟 2019-12-01 21:20:38 2373 浏览量 回答数 1

问题

基于Apache Nutch和Htmlunit的扩展实现AJAX页面爬虫抓取解析插件 请求报错

kun坤 2020-05-28 16:03:29 4 浏览量 回答数 1

问题

jsp网站静态化/本地化 400 请求报错 

kun坤 2020-05-29 09:56:20 2 浏览量 回答数 1

问题

通过gulp-connect部署静态页面,html页面中include路径无法get!

杨冬芳 2019-12-01 20:02:12 1593 浏览量 回答数 1

问题

Web开发者不可不知的15条编码原则

技术小菜鸟 2019-12-01 21:19:56 2473 浏览量 回答数 1

问题

请教各位web 开发中如何处理用户输入的html 代码?

落地花开啦 2019-12-01 20:04:28 923 浏览量 回答数 1

回答

xhtml中隐藏滚动条在用ie6浏览有框架的xhtml页面的时候,默认会水平和垂直滚动条会一起出现,这是ie6的一个bug,在firefox上是正常的,出现的原因是其对XHTML 1.0 transitional doctype的解释缺陷.对于这个bug一般有3种解决方案,方法1:代码:程序代码html { overflow-y: scroll; } 原理:强制显示ie的垂直滚动条,而忽略水平滚动条优点:完全解决了这个问题, 允许你保持完整的XHTML doctype.缺点:即使页面不需要垂直滚动条的时候也会出现垂直滚动条。方法2:(推荐采用)代码:程序代码html { overflow-x: hidden; overflow-y: auto; }原理:隐藏横向滚动,垂直滚动根据内容自适应优点:在视觉上解决了这个问题.在不必要的时候, 未强制垂直滚动条出现.缺点:只是隐藏了水平滚动条,如果页面真正需要水平滚动条的时候,屏幕以外的内容会因为用户无法水平滚动,而看不到。方法3:代码:程序代码body { margin-right: -15px; margin-bottom: -15px; }原理:这会在margin的水平和垂直方向上添加一个负值, IE添加了该精确数值后, 便会去除对滚动条的需求假象.优点:在视觉上解决了这个问题.,垂直滚动根据内容自适应缺点:由于"人为创建"了15px的外边距(margin), 所以无法使用该填充过的屏幕区域.设置样式在原来的html的时候,我们可以这样定义整个页面的滚动条程序代码body{ scrollbar-3dlight-color:#D4D0C8; /*- 最外左 -*/ scrollbar-highlight-color:#fff; /*- 左二 -*/ scrollbar-face-color:#E4E4E4; /*- 面子 -*/ scrollbar-arrow-color:#666; /*- 箭头 -*/ scrollbar-shadow-color:#808080; /*- 右二 -*/ scrollbar-darkshadow-color:#D7DCE0; /*- 右一 -*/ scrollbar-base-color:#D7DCE0; /*- 基色 -*/ scrollbar-track-color:#;/*- 滑道 -*/ } 但是同样的代码,我们应用在 xhtml下就不起作用了,我相信好多好朋友也遇到过同样的问题那么怎么才能在xhtml下应用滚动条样式呢?看下列代码程序代码html{scrollbar-3dlight-color:#D4D0C8; /*- 最外左 -*/ scrollbar-highlight-color:#fff; /*- 左二 -*/ scrollbar-face-color:#E4E4E4; /*- 面子 -*/ scrollbar-arrow-color:#666; /*- 箭头 -*/ scrollbar-shadow-color:#808080; /*- 右二 -*/ scrollbar-darkshadow-color:#D7DCE0; /*- 右一 -*/ scrollbar-base-color:#D7DCE0; /*- 基色 -*/ scrollbar-track-color:#;/*- 滑道 -*/ }这段代码和上一段唯一的不同就是在css定义的元素上,一个是body一个是html。我们再测试一下,把html页面的"body"修改成"html"测试一下,发现依然可以实现效果。那到底是为什么呢?从字面上来看,xhtml比html多一个x,那么这个x其实也就是xml,为什么要加一个xml在里面?其实最根本的原因就是要让html更加结构化标准化(因为html实在是太烂)。我们在html里面定义的是body,因为html不是很标准所以这样可以生效,而在xhtml里面这样就不行了,我看看那个图很明显,body标签本身不是根元素,只有html才是根元素,而页面的滚动条也是属于根元素的,所以这就是我们为什么定义body没有效果的原因,因为我们定义的只是一个子原素。ok,我们知道了原理,来做一个试验如果把定义"body"或"xhtml"换成"*",程序代码*{ scrollbar-3dlight-color:#D4D0C8; /*- 最外左 -*/ scrollbar-highlight-color:#fff; /*- 左二 -*/ scrollbar-face-color:#E4E4E4; /*- 面子 -*/ scrollbar-arrow-color:#666; /*- 箭头 -*/ scrollbar-shadow-color:#808080; /*- 右二 -*/ scrollbar-darkshadow-color:#D7DCE0; /*- 右一 -*/ scrollbar-base-color:#D7DCE0; /*- 基色 -*/ scrollbar-track-color:#;/*- 滑道 -*/ }在html和xhtml都通过,因为*就是定义页面上的任何标签当然也包括了“html”这个标签。(ps:其实与其说是html与xhtml的区别到不如说是有无XHTML 1.0 transitional doctype的区别,但是如果你把页面的XHTML 1.0 transitional doctype去掉的话,那么这个页面就没有doctype,默认的显示方式就是html4.01,不过你要把XHTML 1.0 transitional doctype修改成HTML 4.01 doctype同样页面定义body也不会有效果的,虽然这个页面的标准是html 4.01)转载:http://www.cnblogs.com/Miton/archive/2011/06/01/2066056.html

杨冬芳 2019-12-02 02:41:02 0 浏览量 回答数 0
阿里云大学 云服务器ECS com域名 网站域名whois查询 开发者平台 小程序定制 小程序开发 国内短信套餐包 开发者技术与产品 云数据库 图像识别 开发者问答 阿里云建站 阿里云备案 云市场 万网 阿里云帮助文档 免费套餐 开发者工具 企业信息查询 小程序开发制作 视频内容分析 企业网站制作 视频集锦 代理记账服务 2020阿里巴巴研发效能峰会 企业建站模板 云效成长地图 高端建站