opera | 易学教程

新手理解HTML、CSS、javascript之间的关系-修订

阅读更多关于新手理解HTML、CSS、javascript之间的关系-修订

几年前写过一篇博文《新手理解HTML、CSS、javascript之间的关系》，没想到网上出现了不少转载，当时没有太用心，里面的很多内容有待商榷，这里发布重新发布一篇。网页主要有三部分组成，结构(HTML)、表现(CSS)、行为(Javascript)。一、HTML、CSS、JavaScript简介和分工 1、什么是HTML（超文本标记语言 Hyper Text Markup Language），HTML 是用来描述网页的一种语言。 2、CSS(层叠样式表 Cascading Style Sheets),用来定义如何显示 HTML 元素，语法为：selector {property：value} (选择符 {属性：值}) 3、JavaScript是一种脚本语言，其源代码在发往客户端运行之前不需经过编译，而是将文本格式的字符代码发送给浏览器由浏览器解释运行对于一个网页，HTML定义网页的结构，CSS描述网页的样子，JavaScript定义网页的行为，打个比喻，HTML就像一个人的骨骼、器官，而CSS就是人的皮肤，有了这两样也就构成了一个植物人了，加上javascript这个植物人就可以对外界刺激做出反应，可以思考、运动、可以给自己整容化妆（改变CSS）等等，成为一个活生生的人；如果说HTML是肉身、CSS就是皮相、Javascript就是灵魂。没有Javascript

50道CSS基础面试题（附答案）

阅读更多关于 50道CSS基础面试题（附答案）

https://segmentfault.com/a/1190000013325778 1 介绍一下标准的CSS的盒子模型？与低版本IE的盒子模型有什么不同的？标准盒子模型：宽度=内容的宽度（content）+ border + padding + margin 低版本IE盒子模型：宽度=内容宽度（content+border+padding）+ margin 2 box-sizing属性？用来控制元素的盒子模型的解析模式，默认为content-box context-box：W3C的标准盒子模型，设置元素的 height/width 属性指的是content部分的高/宽 border-box：IE传统盒子模型。设置元素的height/width属性指的是border + padding + content部分的高/宽 3 CSS选择器有哪些？哪些属性可以继承？ CSS选择符：id选择器(#myid)、类选择器(.myclassname)、标签选择器(div, h1, p)、相邻选择器(h1 + p)、子选择器（ul > li）、后代选择器（li a）、通配符选择器（*）、属性选择器（a[rel="external"]）、伪类选择器（a:hover, li:nth-child）可继承的属性：font-size, font-family, color 不可继承的样式

CSS学习笔记

阅读更多关于 CSS学习笔记

Cascading Style Sheet（层叠样式表、级联样式表） px与屏幕分辨率有关 css样式表推荐的书写顺序：显示属性（display、list-style、position、float、clear) 自身属性（width、height、margin、padding、border、background）文本属性（color、font、text-decoration、text-align、vertical-align、white-space、othertext、content)。边偏移 top：定义元素相对于其父元素上边线的距离。 right：定义元素相对于其父元素右边线的距离。 bottom:定义元素相对于其父元素下边线的距离。 left:定义元素相对于其父元素左边线的距离。例如： top:auto/长度值/百分比层叠定位属性 z-index h1和p元素之间默认会保留间隙，浏览器在标记上应用默认的上下边界为标题指定一个负的下边距边距可以是负值，填充不可以是负值 span可以单独设置样式行间距（行高）可以用line-height line-height可以不用单位，有单位的话，span将会继承实际的行距，而不会继承比例。 hr水平线的样式：基于Mozilla的李岚清使用background-color定义线的颜色，IE用color定义图片边框：img {

浅析html+css+javascript之间的关系与作用

阅读更多关于浅析html+css+javascript之间的关系与作用

三者间的关系一个基本的网站包含很多个网页，一个网页由html, css和javascript组成。 html是主体，装载各种dom元素；css用来装饰dom元素；javascript控制dom元素。用一扇门比喻三者间的关系是：html是门的门板，css是门上的油漆或花纹，javascript是门的开关； html介绍 html是用来描述网页的一种语言，它不是一种编程语言，而是一种标记语言（标记标签），总的来说，html使用标记标签来描述网页，本文就用标签来代替标记标签进行说明。标签是指<html></html>，<div></div>。标签是有语义的：标题用<h1>，表格展示用<table>，链接用<a>，无序排列用<ul>等等。标签里可带有各类属性，最基本的就是class和id。class属性的作用是引用css样式；id的作用是配合javascript使用，具有唯一性。下面举几个例子说明 l 图片标签<img>的主要属性有src，alt。src是引用图片的网络地址（必要）；alt是对这张图片的描述，如果图片加载不成功，则会显示alt的文字。 l 超链接<a>的主要属性有href，target。href是指链接要跳转的网址（必要）；target是告诉浏览器点击这个链接后要以哪种形式找开窗口，target=”_blank”是指打开一个新窗口若想了解更多关于html的资料

HTML5-表单自带验证

阅读更多关于 HTML5-表单自带验证

表单语法 <form method="post"（规定如何发送表单数据常用值：get|post） action="result.html">（表示向何处发送表单数据） <p> 名字：<input name="name" type="text" > </p> <p> 密码：<input name="pass" type="password" > </p> <p> <input type="submit" name="Button" value="提交"/> <input type="reset" name="Reset" value="重填“/> </p> </form> 经验：在实际网页开发中通常采用post方式提交表单数据表单元素格式语法： < input type ="text" （input元素类型）name ="fname" （input元素名称） value ="text" （input元素的值） /> 表单元素文本框-语法 < input type ="text" (文本框) name ="userName" (文本框名称) value ="用户名" (文本框初始值) size ="30" (文本框长度) maxlength ="20" (文本框可输入最多字符) /> 密码框-语法 < input type ="password " (密码框) name =

跨域简单介绍

阅读更多关于跨域简单介绍

1.什么是跨域下面的这些情况是属于跨域的: 协议不同，如http, https；端口不同；主域相同，子域不同；主域不同； ip地址和域名之间也算是跨域，浏览器不会自动做ip域名的映射； 2.跨域不能访问的原因说到跨域，一般人都有一个模糊的概念，大概就是从一个域名的网页去访问了另一个域名的资源,获取失败了。但是跨域产生的原因，有些人可能就没了解过。跨域的原因跨域时不能获取资源，并不是服务器做了一些限制。而是浏览器做的限制。没错,你写一个ajax跨域请求时，打开F12调试，会发现在response里面是拿到了服务器返回的数据的。由此可以看出服务器并没有对跨域做限制，数据通信是正常的。问题出现的原因，就是浏览器判断了该请求是跨域请求，所以即使从服务器拿到了数据，也不显示给你。并且提示你出错了，跨域请求了。所以，现在一般人在说跨域的时候都在说ajax跨域问题，js跨域问题，这个叫法是不对的，应该改成，浏览器的跨域问题， 3.为什么浏览器会有跨域限制如果浏览器不做跨域限制,会出现安全问题。比如可以做下面的攻击: 1.用户登录了自己的银行页面 http://mybank.com，http://mybank.com向用户的cookie中添加用户标识。 2.用户浏览了恶意页面 http://evil.com。执行了页面中的恶意AJAX请求代码。 3.http:/

Brave浏览器中的IPFS

阅读更多关于 Brave浏览器中的IPFS

Brave浏览器用户人数已经超过2000万，并且已经开始支持本地 IPFS 协议，让人们可以更轻松简单的使用分布式网络，这一实现标志着更具弹性、用户至上的互联网发展的迈出重要一步。 IPFS协议仍然在开发、完善中。相信很多人在日常上网过程中，经常遇到如网络中断或404，重要信息（如COVID-19新闻）被过滤、联网成本高昂，以及断网和离线环境中的共享与协作功能等实际问题。这些并不是每个人面临的问题，那些一点也没有察觉到这些问题的人可能不明白为什么IPFS如此重要。但是对于迫切需要一个弹性开放的互联网，使得他们可以自主控制自己在线体验的人，IPFS现在只需点击一下就可以安装在Brave的浏览器上。 Brave浏览器中的IPFS Brave已将IPFS集成到其桌面Web浏览器中，用于 Windows、macOS 和 Linux。当 Brave 检测到一个地址是 IPFS 内容的 HTTP 网关 URL，或者本机 IPFS 地址（例如将提示用户安装和启用本机 IPFS 节点或使用 HTTP 网关）时，使用的默认网关是 dweb.link，由协议实验室运行。用户还可以在浏览器设置中指定自己选择的网关。您可以在访问的IPFS管理UI，或启用IPFS助手并在主菜单选择"我的节点"按钮。为什么选择 Web 浏览器？现代网络浏览器支持在互联网上进行实验、创新和新的协作以及价值交换模式

addEventListener与attachEvent区别

阅读更多关于 addEventListener与attachEvent区别

DOM2级事件处理程序 DOM2级事件定义了两个方法用于处理指定和删除事件处理程序的操作： addEventListener removeEventListener 所有的DOM节点都包含这两个方法，并且他们都接受三个参数： 1.事件类型 2.事件处理方法 3.布尔参数，默认false (true捕获阶段调用事件处理方法；false冒泡阶段调用事件处理方法。) 参数参数说明 element.addEventListener(type,listener,bool) element 要绑定事件的对象，及HTML节点。 type 事件名称，注意去掉事件前边的“on”，比如“onclick”要写成“click”，“onmouseover”要写成“mouseover”。 listener 要绑定的事件监听函数，注意只写函数名，不要带括号。 bool: true捕获阶段调用事件处理方法；false冒泡阶段调用事件处理方法。 IE不支持addEventListener和removeEventListener方法实现了两个类似的方法： attachEvent detachEvent 这两个方法都接受两个相同的参数。 1.事件处理程序名称 2.事件处理程序方法 IE只支持事件冒泡兼容性 attachEvent——兼容：IE7、IE8；不兼容firefox、chrome、IE9

EasyRTC实现基于WebRTC技术实现的即时通信类应用

阅读更多关于 EasyRTC实现基于WebRTC技术实现的即时通信类应用

WebRTC简介 WebRTC，名称源自网页即时通信（英语：Web Real-Time Communication）的缩写，是一个支持网页浏览器进行实时语音对话或视频对话的API。它于2011年6月1日开源并在Google、Mozilla、Opera支持下被纳入万维网联盟的W3C推荐标准。EasyRTC基于WebRTC，凭借多年音视频开发经验并结合实际情况，开发了基于WebRTC的音视频通讯云平台，提供互动教学、连麦直播、视频会议、指挥调度等多种音视频跨平台解决方案。 WebRTC历史 2010年5月，Google以6820万美元收购VoIP软件开发商Global IP Solutions的GIPS引擎，并改为名为“WebRTC”。WebRTC使用GIPS引擎，实现了基于网页的视频会议，并支持722，PCM，ILBC，ISAC等编码，同时使用谷歌自家的VP8视频解码器；同时支持RTP/SRTP传输等。 2012年1月，谷歌已经把这款软件集成到Chrome浏览器中。同时FreeSWITCH项目宣称支持iSAC audio codec。 WebRTC核心API WebRTC原生APIs文件是基于WebRTC规格书撰写而成，这些API可分成Network Stream API、 RTCPeerConnection、Peer-to-peer Data API三类： Network

selenium源码分析系列第一篇

阅读更多关于 selenium源码分析系列第一篇

Selenium源码分析之目录结构分析阅读源码的作用看下selenium python端的目录结构阅读源码的作用阅读理解源码能够让我们更容易掌握和理解selenium，让我们能更好做二次封装，加强基层代码能力。 ##安装selenium pip install selenium -m 查看安装完成后的信息看下selenium python端的目录结构 common/exceptions.py 定义了所有可能在webdriver代码中出现的异常 webdriver/android webdriver/blackberry webdriver/chrome webdriver/edge webdriver/ie webdriver/firefox webdriver/opera webdriver/safari webdriver/iewebkitgtk 上述各目录定义了各浏览器兼容的代码，即用于支持不同的浏览器 webdriver/common 定义了webdriver所指定的通用能力 webdriver/remote 定义了webdriver核心能力 webdriver/support 定义了webdriver辅助能力未完待续下一篇文章将继续探索每个文件的来源： oschina 链接： https://my.oschina.net/u/4391448/blog

订阅 opera