js em元素_.em js_html中em元素 - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

移动端页面的自适应rem

具体来说，有的屏幕320px宽，有的屏幕640px宽，有的更宽，如果你写固定px，那么要么小的放不下，要么大的有大片空白。

02

轮播图效果，不再局限于JS制作！

HTML5学堂（码匠）：网页的轮播图一直都是个比较精美的制作，同时也是用户体验较佳的效果。在开发工程师进行制作的时候往往会选择使用JS来书写，由此不禁会问，难道真的只有使用JS才能制作轮播图吗？本文主要内容 1. 效果展示 2. 主要涉及到的知识点 3. 基本实现思路 4. 案例实现 1. 效果展示 CSS3动画效果的强大不言而喻，自它出现一直是热度不减，毋庸置疑的是CSS3动画的出现在一定程度上降低了动画效果的实现难度。其精练的代码把我们从复杂的JS制作中解放出来，如下的轮播图效果即是纯CSS3制作的。

06

您找到你想要的搜索结果了吗？

是的

没有找到

【融职培训】Web前端学习第2章网页重构18 rem布局

PC端页面的网页重构，我们使用最多的单位是px。因为在PC端，大部分页面效果我们都可以设置成固定尺寸，但是在手机端，这种方案是不可行的，我们必须要按照百分比呈现页面，才能保证网页在任何设备上可以正常显示。

01

vue v-html指令

v-html 指令可以用于任何元素，它会将元素的内容替换为绑定的数据，并解析其中的 HTML 标签。用法如下：

00

Web前端学习第2章网页重构18 rem布局

PC端页面的网页重构，我们使用最多的单位是px。因为在PC端，大部分页面效果我们都可以设置成固定尺寸，但是在手机端，这种方案是不可行的，我们必须要按照百分比呈现页面，才能保证网页在任何设备上可以正常显示。

03

jQuery的使用

1.需求分析在首页中(logo的上方)显示一个广告图片(页面加载后，间隔3秒弹出广告图片，再间隔3秒后隐藏广告图片)。【使用jQuery实现】

03

web前端之锋利的jQuery八：jQuery插件的使用（表单验证、表单提交）

插件也称扩展，是一种遵循一定规范的应用程序接口编写出来的程序。 1.jQuery表单验证插件－Validation：最常使用JavaScript的场合就是表单的验证，而jQuery作为一个优秀的JavaScript库，也提供了一个优秀的表单验证插件－Validation，其拥有以下优点：内置验证规则：拥有必填、数字、email、URL和信用卡号等19类内置验证规则。自定义验证规则：可以很方便地自定义验证规则简单强大的验证信息提示：默认了验证信息提示，并提供自定义覆盖默认提示信息的功能实时

05

CSS3中的变量var了解

CSS中原生的变量定义语法是：--*，变量使用语法是：var(--*)，其中*表示我们的变量名称。关于命名这个东西，各种语言都有些显示，例如CSS选择器不能是数字开头，JS中的变量是不能直接数值的，但是，在CSS变量中，这些限制通通没有，例如：

03

css篇-面试题7-说一说rem与em的区别并如何做移动端适配

rem 是基于 html 元素的字体大小来决定，而 em 则根据使用它的元素的大小决定,一般被称为相对长度单位,是根据它父元素的字体大小来计算的，一般默认情况下：16px = 1em

05

不要再用js设置rem了，现代css自适应方案来了

在做移动端适配的时候，很多人第一反应就是使用 rem ，通过动态设置 html 上的 font-size 来进行页面的自适应，基本原理就是 rem 表示的是 root em ，页面中所有的值都是基于html上的 font-size ，相对的进行对应的变化

04

谷歌 HTML/CSS 规范

这篇文章定义了 HTML 和 CSS 的格式和代码规范，旨在提高代码质量和协作效率。通用样式规范协议省略图片、样式、脚本以及其他媒体文件 URL 的协议部分（http:,https:），除非文件

08

精选前端面试题之HTML5/CSS3

HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言最主要的不同： XHTML 元素必须被正确地嵌套。 XHTML 元素必须被关闭。标签名必须用小写字母。 XHTML 文档必须拥有根元素。

01

Rem布局的原理解析

rem和em很容易混淆，其实两个都是css的单位，并且也都是相对单位，现有的em，css3才引入的rem，在介绍rem之前，我们先来了解下em。

02

videojs播放器插件使用详解

HLS是苹果公司实现的基于 HTTP 的流媒体传输协议，全称 HTTP Live Streaming，可支持流媒体的直播和点播，主要应用在 iOS 系统，为 iOS 设备（如 iPhone、iPad）提供音视频直播和点播方案。

静态布局、自适应布局、流式布局、响应式布局、弹性布局等的概念和区别

1、布局特点：不管浏览器尺寸具体是多少，网页布局始终按照最初写代码时的布局来显示。常规的pc的网站都是静态（定宽度）布局的，也就是设置了min-width，这样的话，如果小于这个宽度就会出现滚动条，如果大于这个宽度则内容居中外加背景，这种设计常见与pc端。 2、设计方法：　　PC：居中布局，所有样式使用绝对宽度/高度(px)，设计一个Layout，在屏幕宽高有调整时，使用横向和竖向的滚动条来查阅被遮掩部分；　　移动设备：另外建立移动网站，单独设计一个布局，使用不同的域名如wap.或m.。

03

Vue2.5 零基础开发去哪儿网实战(二) - Vue 起步

本章将快速讲解部分 Vue 基础语法，通过 TodoList 功能的编写，在熟悉基础语法的基础上，扩展解析 MVVM 模式及前端组件化的概念及优势。

05

rem适配移动端的原理及应用场景

我们h5项目终端适配采用的是淘宝那套《Flexible实现手淘H5页面的终端适配》方案。主要原理是rem布局。最近和别人谈弹性布局原理，发现虽然已经使用了那套方案很久，但是自己对rem的理解很含糊，包括vw、vh等。所以打算写博客总结一下，以加深理解。

02

从零开始制作Web插件网页特效小兔子组件(小挂件widget),基于原生CSS/NPM

著意登楼瞻玉兔，何人张幕遮银阙？又到了一年一度的网页小挂件环节，以往我们都是集成别人开源的组件，但所谓熟读唐诗三百首，不会做诗也会吟，熟读了别人的东西，做几首打油诗也是可以的，但若不能自出机抒，却也成不了大事，所以本次我们从零开始制作属于自己的网页小挂件，博君一晒。

04

CSS 你到底有多少长度单位？

听说糙着干活的只靠 px 和 % 闯天下，不知道在看文章的你是不是也是其中一员，哈哈哈哈

02

Rem布局的原理探究

在用前端给移动端页面写布局时，我接触到了Rem布局，但是老实说我也看了几篇手淘适配的文章，并且主要的目的是拿到代码写出demo，所以对于Rem我还是停留在只会使用的阶段，但是理解的并不透彻，所以要抽出时间，把rem布局的原理搞清楚。

03

CSS: 了解一下 REM

先看看 rem 兼容性（基本上所有主流的浏览器都支持）-https://caniuse.com/#feat=rem

01

React组件设计实践总结03 - 样式的管理

CSS 是前端开发的重要组成部分，但是它并不完美，本文主要探讨 React 样式管理方面的一些解决方案，目的是实现样式的高度可定制化, 让大型项目的样式代码更容易维护.

02

Web前端面试题目及答案汇总

以下是收集一些面试中经常会遇到的经典面试题以及自己面试过程中无法解决的问题，通过对知识的整理以及经验的总结，重新巩固自身的前端基础知识，如有错误或更好的答案，欢迎指正。: ）

02

JavaScript之Style属性学习

当CSS使用伪类开始侵入DOM和JavaSCript所控制着的行为层时,DOM和JavaScript也使用他们的一系列样式去控制表现层,这篇随笔主要说的就是利用JavaScript去控制元素的表现形式, 一、Style属性文档中的每一个元素都是一个对象,每个对象又有着各式各样的属性。有一些元素告诉我们元素在节点树上的位置信息。比如说,parentNode、nextSibling、previousSibling、childNodes、 firstChild、lastChild这些属性,就告诉了我们文档中各节

08

document.all的详细解释(document.all基本上所有浏览器可用！)

document.all是IE 4.0及以上版本的专有属性，是一个表示当前文档的所有对象的娄组，不仅包括页面上可见的实体对象，还包括一些不可见的对象，比如html注释等等。在document.all数组里面，元素不分层次，是按照其在文档中出现的先后顺序，平行地罗列的。所以可以用数字索引来引用到任何一个元素。但比较常用的是用对象id来引用一个特定的对象，比如document.all[“element”]这样。 document.layers是Netscape 4.x专有的属性，是一个代表所有由储如

<layer>等定位了的元素的数组。通常也是用

或<layer>对象的id属性来引用的，但是这里面不包含除此以外的其它元素。其实这两个属性没什么可比性，大概你经常看到他们同时出时，这有一个历史原因。在第四代浏览器出现的时候，标准相当混乱，Netscape和微软分别推出了它们的Navigator 4.x和IE 4.0，这两个浏览器的巨大差异，也使开发者面临了一个使网页跨浏览器兼容的噩梦。而document.layer和document.all分别是两者一个最显著的标志，为了确定浏览者使用的什么浏览器，通常用是否存在document.layers和document.all来判断。新的统一的标准用document.getElementById等系列方法来引用DOM对象，而且Netscape 6.0以后放弃了layers特征，虽然IE继续保留了document.all，但这最终没有成为DOM标准的一部分。希望document.layers和document.all能够早日作古，让标准早日深入人心！

02

试试原生 Web Component：比你想象的容易

<template>是一个HTML元素，它允许我们创建一个模板——web组件的HTML结构。模板不必是一大块代码。它可以很简单:

02

前端开发必会的HTML/CSS硬知识（二）

文/小魔女本文简介前端开发系列的第二篇文章基础知识就像是一把宝剑，能让你驰骋在前端领域的战场知识亦有温度，让我们对新知识永远保持热度吧分享小魔女的音乐 html渲染、css解析在面试中，这部分基础知识，非常常见。将以最简洁的文字，让读者掌握。浏览器从开始解析HTML到渲染结束都经历了什么？解析HTML文件，创建DOM树解析CSS，形成CSS对象模型将CSS与DOM合并，构建渲染树（rendering tree）布局和绘制浏览器解析CSS是从左开始还是从右？为什么？

03

前端面试实录HTML篇

01

js学习：自定义类库 - miniQuery 2.0

Paste_Image.png 在上一篇零基础打造自己的 js 类库（1）中，原本只是为了写个小案例，说明一下闭包，js对象的作用。后来我隐约有一个想法，我是不是可以将miniQuery写得更完善一些呢。我的意思是说，尽量使用jQuery的调用规则，看看自己能不能把常用的方法模拟出来？这个想法产生以后，我感觉挺兴奋，正好可以藉由这个机会把js的知识点再复习一下。今后只要有时间，我就把miniQuery更新一下，添加新的api方法进去。作为自己的一个学习记录。零基础打造自己的 js 类库（1）

07

响应式设计笔记

HTML 4和CSS 2目前支持为不同的媒体类型设定专有的样式表。比如，一个页面在屏幕上显示时使用无衬线字体，而在打印时则使用衬线字体。screen和print是两种已定义的媒体类型。媒体查询让样式表有更强的针对性，扩展了媒体类型的功能。

02

制作H5响应式页面注意事项、微信二次分享

1、H5页面（APP端） 1.1 APP端页面用HTML5制作，头部需要加适配信息：　　<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <meta name="format-detection" content="telephone=no" /

09

制作H5响应式页面注意事项、微信二次分享

1.2.1 重要的图片用img标签（例如头部banner等包含特定信息的内容图片），不重要的底板用背景形式显示，例如底部背景

00

FontAwesome基础知识

注意：fa前缀最新版本中已弃用。新的默认设置是实心的fas样式和品牌的fab样式。

01

jqueryUI 设置数值的滑动条

可以从这个方法中获取到了小红块的拖动偏移量left，那么只要通过这个left进行计算，将计算的值赋值给右边的数字之中。

05

js事件

1.document.write(""); 输出语句 2.JS中的注释为// 3.传统的HTML文档顺序是:document->html->(head,body) 4.一个浏览器窗口中的DOM顺序是:window->(navigator,screen,history,location,document) 5.得到表单中元素的名称和值:document.getElementById("表单中元素的ID号").name(或value) 6.一个小写转大写的JS: document.getElementById(

总结几条Javascript实用的语句

总结几条Javascript实用的语句，供新手快速学习入门，相信会对你有很大的帮助。

02

求职 | 史上最全的web前端面试题汇总及答案

作者 | 樱桃小丸子儿链接 | http://www.jianshu.com/p/abadcc84e2a4 HTML&CSS img的alt和title的异同？ alt 是图片加载失败时，显示在网页上的替代文字； title 是鼠标放上面时显示的文字,title是对图片的描述与进一步说明; 这些都是表面上的区别，alt是img必要的属性，而title不是。对于网站seo优化来说，title与alt还有最重要的一点：搜索引擎对图片意思的判断，主要靠alt属性。所以在图片alt属性中以简要文字说明，同时包

01

CSS3 基础知识[转载minsong的博客]

CSS3 基础知识 1.边框 1.1 圆角 border-radius:5px 0 0 5px; 1.2 阴影 box-shadow:2px 3px 4px 5px rgba(0,0,0,0.5);(水平、垂直、模糊、扩展) box-shadow:inset 1px 2px 3px 4px #fff;(inset 内阴影) 1.3 边框图像 border-image 2.背景 2.1 background-size background-size:30px 30px;(背景图像宽度，背景图像高度) 2.2 background-image:linear-gradient(45deg,rgba(0,0,0,0.5) 25%,transparent 25%,transparent 50%,rgba(0,0,0,0.5) 50%,rgba(0,0,0,0.5) 75%,transparent 75%,transparent);(线性渐变，和background-size一起用) 2.3 background-attachment:(fixed|scroll|local) fixed：背景图像相对于窗体固定。 scroll：背景图像相对于元素固定，也就是说当元素内容滚动时背景图像不会跟着滚动，因为背景图像总是要跟着元素本身。但会随元素的祖先元素或窗体一起滚动。 local：背景图像相对于元素内容固定，也就是说当元素随元素滚动时背景图像也会跟着滚动，因为背景图像总是要跟着内容。 2.4 background-position:30px 20px;(横坐标，纵坐标；是图片在动) 2.5 background-origin:(padding-box|border-box|content-box) padding-box：从padding区域（含padding）开始显示背景图像。 border-box：从border区域（含border）开始显示背景图像。 content-box：从content区域开始显示背景图像。 3.文本 3.1 文字阴影 text-shadow:5px 5px 4px #000;(水平，垂直，模糊) 3.2 换行 word-wrap:(normal|break-word) normal：允许内容顶开或溢出指定的容器边界。 break-word：内容将在边界内换行。如果需要，单词内部允许断行。 white-space:(normal|pre|nowrap|pre-wrap|pre-line) normal：默认处理方式。 pre：用等宽字体显示预先格式化的文本，不合并文字间的空白距离，当文字超出边界时不换行。可查阅pre对象 nowrap：强制在同一行内显示所有文本，直到文本结束或者遭遇br对象。 pre-wrap：用等宽字体显示预先格式化的文本，不合并文字间的空白距离，当文字碰到边界时发生换行。 pre-line：保持文本的换行，不保留文字间的空白距离，当文字碰到边界时发生换行。 3.3 省略号 width:200px; overflow:hidden; text-overflow:hidden; white-space:nowrap; 4.2D变换 4.1 旋转 transform:rotate(45deg); 4.2 移动 transform:translate(45px,45px);(水平，垂直) 4.3 缩放 transform:scale(2,2);(水平，垂直) 4.4 翻转 transform:skew(20deg,40deg);(沿X轴翻转，沿Y轴翻转) 4.5 将以上四个组合在一起 matrix(),需要六个参数，包含数学函数，允许您：旋转、缩放、移动以及倾斜元素。暂放 5.过渡 5.1 transition : [ transition-property ] || [ transition-duration ] || [ transition-timing-function ] || [ transition-delay ] [ transition-property ]：检索或设

06

jQuery基础--创建节点和添加节点

创建节点 $(function () { // var box = document.getElementById("box"); // // var a = document.createElement("a"); // box.appendChild(a); // a.setAttribute("href", "http://web.itcast.cn"); // a.setAttribute("target", "_blank"); // a.innerHTML

01

简单粗暴的移动端适配方案 - REM

0. 前言手机市场日渐丰富的同时，给我们前端开发人员带来的网页内容自适应屏幕尺寸进行显示的问题也日渐凸显出来。原本可能通过百分比/媒体查询等简单手段就可以常见的适配问题，但是对于页面有复杂结构或者

videojs插件使用「建议收藏」

使用整理：使用主要针对于移动端视频播放，考虑的点：视频显示适配手机宽度；适配定义样式；在微信端，安卓、ios视频空间控件不同，定制等会自动被微信视频控件覆盖；播放过程中定制暂停/播放按钮事件等；播放结束后定制重播、下一个视频事件，读秒播放下一个视频

02

js常用函数大全107个

1.document.write(""); 输出语句　　2.JS中的注释为// 　　3.传统的HTML文档顺序是:document->html->(head,body) 　　4.一个浏览器窗口中的DOM顺序是:window->(navigator,screen,history,location,document) 　　5.得到表单中元素的名称和值:document.getElementById("表单中元素的ID号").name(或value) 　　6.一个小写转大写的JS: document.getEl

01

我用 140 行代码，带你看一场流星雨⭐

在一个夜深人静的晚上，程序员小丞坐在屋顶上，看着屏幕上满屏的error，心里拔凉拔凉的，泪水润湿了脸庞，无数个自己提桶跑路的身影充斥在脑海之中，猛然才发现自己还没有桶。此时星空中闪过了漫天的流星，小丞看到此景，心中的bug早已化去，留下的是还原此景的豪言壮举！（梦醒了，纯属瞎编）

03

中文排版二三事

前段时间一直在折腾中文排版相关的事情，自认为结果还算不错。故开源之，即是Entry.css。这是一个可配置的、更适合阅读的中文文章样式库，可以用来快速搭建中文博客主题或是用于项目文档的样式。在这篇博文中会介绍下在做这个库过程中学到的一些中文排版知识，以及它的特色。

01

Web前端面试题目汇总

以下是收集一些面试中经常会遇到的经典面试题以及自己面试过程中无法解决的问题，通过对知识的整理以及经验的总结，重新巩固自身的前端基础知识，如有错误或更好的答案，欢迎指正。:） HTML/CSS部分 1、什么是盒子模型？在网页中，一个元素占有空间的大小由几个部分构成，其中包括元素的内容（content），元素的内边距（padding），元素的边框（border），元素的外边距（margin）四个部分。这四个部分占有的空间中，有的部分可以显示相应的内容，而有的部分只用来分隔相邻的区域或区域。4个部分一起构成了c

04

【React】：CSS 模块化

以下是 CSS Guidelines 中的一个示例，这个示例展示了一个问题：除了写这段代码的人，没有人知道这段代码是干什么的。

02

JS简单页面交互实战 - 点击按钮实现求和功能

上一期堡堡给大家讲解了简单的页面交互效果 - 点击块，让块动起来，让我们更清晰的了解JS逻辑和DOM的结合。如果想具体了解点击块，让块动起来，可以回复“交互”到“HTML5学堂”公众号。而今天我们主要讲解JS简单页面交互实战 - 点击按钮实现求和功能。 Tips：由于上一期的文章篇幅过长，微信的文章有字数要求，所以小编把部分的内容（作用域）放到这一期进行讲解。继上一期的内容 - 作用域作用域我们知道函数就是把多条语句封装起来，那封装起来了，在其它地方能否访问的到？具体看下面的实例。实例： var n

08

移动webapp前端开发小结

公司内部有一款企业社交产品share，近期打算开发手机版，初期规划是通过webapp的方式嵌入到另一款即时通信native app。之前团队还未接触过手机应用的页面重构工作，这次由我打头炮，搭建这款webapp的基本页面样式框架。

02

css 文字自适应大小_div自适应窗口大小

css3提供了一些与当前viewpoint相关的元素，vw，vh，vmin, vmax等。

02

《React极简教程》第二章 React JSXReact JSXReact.createElement独立文件JavaScript 表达式样式数组HTML 标签 vs. React 组件

JSX语法，像是在Javascript代码里直接写XML的语法，实质上这只是一个语法糖，每一个XML标签都会被JSX转换工具转换成纯Javascript代码，React 官方推荐使用JSX，当然你想直接使用纯Javascript代码写也是可以的，只是使用JSX，组件的结构和组件之间的关系看上去更加清晰。

02

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭