首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

前端面试题-每日练习(3)

SVG 面临主要问题一个是如何和已经占有重要市场份额矢量图形格式 Flash 竞争问题,另一个问题就是 SVG 本地运行环境下厂家支持程度。 3.“data-”属性作用是什么?...需要注意是:`data-`之后以连字符分割多个单词组成属性,获取时候使用驼峰风格。 所有主流浏览器都支持 data-* 属性。...label标签来定义表单控制间关系,当用户选择该标签时,浏览器会自动将焦点转到和标签相关表单控件。...(3)浏览器兼容问题三:设置较小高度标签(一般小于10px),IE6,IE7,遨游中高度超出自己设置高度 问题症状:IE6、7和遨游里这个标签高度不受控制,超出自己设置高度 碰到频率:60%...IE浏览器才支持:after,原理和方法2有点类似,zoom(IE专有属性)可解决ie6,ie7浮动问题 优点:浏览器支持好、不容易出现怪问题(目前:大型网站都有使用,如:腾讯,网易,新浪等等)

13520

前端学习(3)~html5详解(一)

H5语义改进 在此基础,HTML5 增加了大量有意义语义标签,更有利于搜索引擎或辅助设备理解 HTML 页面内容。HTML5会让HTML代码内容更结构化、标签更语义化。... 表示标记 (用得少) 表示进度 (用得少) 表示日期 本质新语义标签与、没有区别,只是其具有表意性,使用时除了...HTML结构需要注意外,其它和普通标签使用无任何差别,可以理解成 相当于。...解释一下: l:less 更小 t:than 比 e:equal等于 g:great 更大 PS:我们测试 IE 浏览器兼容时候,可以使用软件 ietest,模拟IE6-IE11...不支持HTML5新标签浏览器,会将这些新标签解析成行内元素(inline)对待,所以我们只需要将其转换成块元素(block)即可使用

1.2K20
您找到你想要的搜索结果了吗?
是的
没有找到

1.HTML基础必备知识学习笔记

另外,用户也可以浏览器直接看到提交数据,一些系统内部消息将会一同显示在用户面前。Post 所有操作对用户来说都是不可见。...温馨提示:W3School 使用是小写标签,因为万维网联盟(W3C) HTML 中推荐使用小写,而在未来 (X)HTML 版本中强制使用小写。...-- IE 支持通过特定 标签来确定绘制当前页面所应该采用 IE 版本。除非有强烈特殊需求,否则最好是设置为 edge mode,从而通知 IE 采用其所支持最新模式。...为带有指定 id 元素改变或添加样式。...狼蛛;塔兰图拉毒蛛--> WeiyiGeek. data-*属性使用图 温馨提示: 用户代理会完全忽略前缀为 “data-自定义属性。

1.2K30

这30个CSS选择器,你必须熟记(中)

11、X[href="foo"]:精准属性值选择器 一小节,我们学习了 X[title] 这样简单属性选择器,如果你想对属性值进行精准匹配如何做呢,不用担心,CSS为我们提供了精准属性选择器,比如我们想把特定网址链接变成绿色...但是有一种解决方案,我们可以使用自定义属性,我们可以图片链接标签中添加data-filetype属性,如下所示: <a href="path/to/image.jpg" data-filetype=...: IE7+ Firefox Chrome Safari Opera 16、X[foo~="bar"]:匹配带有空格属性值 这个技巧大多数人不会用,但是你使用后,一定会让你小伙伴对你刮目相看,波浪号可以选择带有空格属性...pseudo class,比如想给用户鼠标悬停元素加上样式,你就可以使用此选择器: 小提示:旧版IE里,:hover只能用于链接标签。...,选择不满足条件元素,比如我们希望选中所有的div,除了一个 id 为 container div。

63310

这30个CSS选择器,你必须熟记(中)

11、X[href="foo"]:精准属性值选择器 一小节,我们学习了 X[title] 这样简单属性选择器,如果你想对属性值进行精准匹配如何做呢,不用担心,CSS为我们提供了精准属性选择器,比如我们想把特定网址链接变成绿色...但是有一种解决方案,我们可以使用自定义属性,我们可以图片链接标签中添加data-filetype属性,如下所示: <a href="path/to/image.jpg" data-filetype=...: IE7+ Firefox Chrome Safari Opera 16、X[foo~="bar"]:匹配带有空格属性值 这个技巧大多数人不会用,但是你使用后,一定会让你小伙伴对你刮目相看,波浪号可以选择带有空格属性...pseudo class,比如想给用户鼠标悬停元素加上样式,你就可以使用此选择器: 小提示:旧版IE里,:hover只能用于链接标签。...,选择不满足条件元素,比如我们希望选中所有的div,除了一个 id 为 container div。

61300

h5新功能data-*,好好利用,还能做数据双向绑定

(需要注意是虽然styleSheets方法返回结果把link标签引进外部样式也算进去了,但是非IE浏览器没办法获取到他们cssRules属性,只有内嵌style标签元素可以被获取到) document.styleSheets...('.test::before{color:green}',0)//IE系列浏览器使用/* 虽然部分浏览器也可以通过id来指定,'document.styleSheets.id.insertRule()...'这种写法chrome和IE下都行得通,但是firefox会返回'undefined',所以建议还是使用index值来获取stylesheet */ .insertRule语法是stylesheet.insertRule...addrule和insertRule方法本质没区别,只是后者不被IE浏览器识别,所以前者作为浏览器兼容方法存在。(下文为节省篇幅,以insertRule方法指代此两种方法。)...(此情况只针对非IE浏览器,IE浏览器正常,但是定义早往往意味着被后面的样式覆盖,所以意义不大) 同上,如果页面内没有内嵌样式style标签,则insertRule方法也无法发挥作用。

1.8K40

Javascript DOM(一)

函数预解析(函数提升) 把所有的函数声明提升到当前最前面。 实际,变量提升,可能会引发很多问题,会导致变量可以先使用后申明。函数提升暂时没有遇到什么问题。..."); console.log(my); 根据标签名获取 document.getElementsByTagName(标签名,字符串形式); 得到是一个对象集合 通过 HTML5...; }; 操作元素 改变元素内容 element.innerText 不识别 html 标签,空格和换行也会去掉 2. element.innerHTML 识别 html 标签,保留空格和换行 常见元素属性操作...想要保留原来类名基础改的话,则通过 element.className = ‘原来类名 新类名’来保留。...出现问题:不容易判断是内置属性还是自定义属性 设置 H5 自定义属性 H5 规定自定义属性 data-开头作为属性名 直接在标签后给属性赋值 例子:

1.1K30

编码规范

不要省略可选结束标签(closing tag)(例如, 或 ) IE 兼容模式 IE 支持通过特定 标签来确定绘制当前页面所应该采用 IE 版本。...除非有强烈特殊需求,否则最好是设置为 edge mode,从而通知 IE 采用其所支持最新模式。...class id, name data-* src, for, type, href title, alt aria-*, role class 用于标识高度可复用组件,因此应该排在首位。...id 用于标识具体组件,应当谨慎使用(例如,页面内书签),因此排在第二位。 减少标签数量 编写 HTML 代码时,尽量避免多余父元素。很多时候,这需要迭代和重构来实现。请看下面的案例: 不要使用 @import 与 标签相比,@import 指令要慢很多,不光增加了额外请求次数,还会导致不可预料问题。

1.2K70

采用HTML5之data-机制自由提供数据

周末总是过得很快,又到了跟代码亲密接触日子,我北京向各位问好,今天我分享一点关于前端东西,HTML5之标签"data-*"自定义属性值传递。        ...前几天在给公司网站更换页面的过程中,我狠幸运参与了统计模块那块业务和功能改造,由于我个人比较喜欢写一些由聚合函数存在业务SQL,因为这类SQL语句大部分都有优化必要,之前博客中也分享过自己优化一些案例...好了,下面正式来说说HTML5"data-*"机制提供数据,并如何获取。因为之前更换页面的过程中也看到了公司使用"data-*"机制来输送数据,但是对它印象不是太深,就没有深究。...下面是一个表单中定义data-*自定义属性,并如何获取属性数据值。...但是说到这儿,我不得我多说点儿,通过早上各种尝试得出,如果你没有使用驼峰式方式来获取,也可以使用另外一种方式,直接把"data-"去掉,最后data()方法中直接把后面剩余字符串作为参数传入即可获取

663100

如何在Selenium WebDriver中查找元素?(一)

建议网站开发人员避免使用非唯一ID或动态生成ID,但是某些MVC框架(如– ADF)可能会导致页面具有动态生成ID。...如果任何网站具有非唯一ID或具有动态生成ID,则不能使用此策略唯一地查找元素,而是将返回与定位器匹配第一个Web元素。我们将如何克服这种情况,将在XPATH / CSS选择器策略中进行说明。...让我们继续前进,看看如何使用LinkText查找元素 通过链接查找文本/部分链接 使用这种方法,可以找到带有链接名称或具有匹配部分链接名称“ a ”标签( Link )元素。...通过CSS选择器查找 对于生成动态ID网站(例如基于ADF应用程序)或基于最新JavaScript框架(例如–无法生成任何ID或名称React js)构建网站,无法使用ID /名称策略定位器来查找元素...– 带有ID标签 css =标签id public class LocateByCSSSelector { public static void main (String [] args

5.9K10

HTML相关面试题

浏览器标准模式和怪异模式之间区别是什么? 怪癖模式下,浏览器会模拟Navigator 4和IE5方式来渲染页面。 标准模式下,浏览器会用HTML和CSS规范定义方式来渲染页面。...某些浏览器(如IE)怪癖模式下,盒模型(box model)变成IE5.5盒模型(IE5.5盒模型宽和高包括padding和border,即 border-box)。...使用 XHTML 局限有哪些? XHTML要求严格。元素必须被正确地嵌套,元素必须被关闭,空标签也必须被关闭,标签名和属性对大小写敏感,属性名称必须小写,属性值必须加引号等。...编码使用UTF-8,空间域名需要支持多浏览地址,准备多套模板。(对多语言这方面不熟悉) 设计和开发多语言网站时,有哪些问题你必须要考虑?...见 7 Tips and Techniques For Multi-lingual Website Accessibility data-属性作用是什么? 元素存放数据。

43230

Excel中自定义上下文菜单(下)

标签VBA,用户界面 本文接上两篇文章: Excel中自定义上下文菜单(Excel中自定义上下文菜单(中) 上下文菜单技术和技巧 下面的内容展示了如何修改本文中提供代码,以使过程更具灵活性...本文开头VBA示例中,你看到了如何通过使用工作簿Activate和Deactivate事件调用宏来创建和删除菜单控件,从而来更改单元格上下文菜单。...RibbonX中似乎没有支持控件ID列表。可以通过使用VBA代码禁用与一节中所述类似的特定控件来使用变通方法。 那么,如何找到要更改其他上下文菜单名称呢?...下面的宏每个上下文菜单底部添加了一个带有菜单名称按钮。...Excel 2010及后续版本中,可以使用VBA代码将控件添加到几乎每个上下文菜单中。使用VBA更改某些上下文菜单限制与Excel 2007中相同。

2.6K20

跨站请求伪造—CSRF

因为用户在网站登录后,这个网站服务端会在 Cookie 中会放一个凭证,这个凭证是后端用来验证用户身份发评论时候,提交评论请求会带上这个凭证,后端通过判断这个凭证,来确认是哪个用户。...CSRF 特点 攻击一般发起第三方网站,而不是被攻击网站。 攻击是利用受害者在被攻击网站登录凭证,冒充受害者提交操作,仅仅是“冒用”,而不是直接窃取数据。...但是 Origin 以下两种情况下并不存在: 1、 IE11同源策略: IE 11 不会在跨站 CORS 请求添加 Origin 头,Referer 头将仍然是唯一标识。...需要注意以下情况下 Referer 没有或者不可信: 1.IE6、7下使用window.kk=url进行界面的跳转,会丢失 Referer。...之后页面加载完成时,使用 JS 遍历整个 DOM 树, DOM 中所有地址是本站 a 和 form 标签中加入 Token,其他请求就在编码时手动添加 Token 这个参数。

1.3K20

网页编码显示与CSS加载

[TOC] (1) HTML编码规范 用两个空格来代替制表符(tab),嵌套元素应当缩进一次(即两个空格); 属性定义确保全部使用双引号,绝不要使用单引号 不要省略可选结束标签(closing tag...#id 用于标识具体组件,应当谨慎使用(例如,页面内书签)因此排在第二位。...class id, name data-* src, for, type, href title, alt aria-*, role 基础实例: 标签来确定绘制当前页面所应该采用 IE 版本。除非有强烈特殊需求,否则最好是设置为 edge mode,从而通知 IE 采用其所支持最新模式。...当使用特定厂商带有前缀属性时,通过缩进方式,让每个属性垂直方向对齐,这样便于多行编辑。

1.6K20

记一笔前端需要关注安全知识

很多时候我们只是关注我们如何去页面,完成需求,怎么使用框架,样式兼容。很多时候我们忽略前端安全问题。...万恶IE,就是那么奇葩!...其实和反射性xss防御方式一样,前后端对提交任何内容都进行转义,并且在后端可以通过过滤方式过滤script标签或者一些敏刚符号,前端展示文章时候也可以通过直接以字符串显示,而并非通过DOM去进行显示...CSRF(跨站点请求伪造) 原理: 用户登录了受信网站,生成了对应cookie 用户不退出登录受信网站情况下,访问了钓鱼网站 钓鱼网站调用通过image或其他方式访问了受信网站url,然后浏览器就会带上受信网站...可以加载指定来源frame页面(可以定义frame页面的地址) 另外一种会出现点击劫持就是文章网站,例如攻击者提交了一个带有一些特殊布局html标签和点击事件文章,如果没有XSS防御的话,就很容易被点击劫持了

25840

Bootstrap HTML编码规范

IE 兼容模式 IE 支持通过特定  标签来确定绘制当前页面所应该采用 IE 版本。除非有强烈特殊需求,否则最好是设置为edge mode,从而通知 IE 采用其所支持最新模式。...这样做好处是,可以避免 HTML 中使用字符实体标记(character entity),从而全部与文档编码一致(一般采用 UTF-8 编码)。...任何时候都要尽量使用最少标签并保持最小复杂度。 属性顺序 HTML 属性应当按照以下给出顺序依次排列,确保代码易读性。...class id, name data-* src, for, type, href title, alt aria-*, role class 用于标识高度可复用组件,因此应该排在首位。...id 用于标识具体组件,应当谨慎使用(例如,页面内书签),因此排在第二位。 Example link 布尔(boolean)型属性 布尔型属性可以声明时不赋值。

1.5K90
领券