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

CSS 2020 Level 4缩短选择器长度新伪

h1 > b, h2 > b, h3 > b, h4 > b, h5 > b, h6 > b { color: hotpink; } 更好选择是,你可以使用:is(),在避免过长选择器同时提高可读性...:is(h1,h2,h3,h4,h5,h6) > b { color: hotpink; } 可读性和更短选择器只是:is()和:where()给CSS带来价值一部分。...在这篇文章中,你会了解到这两个功能性伪选择器语法和价值。 浏览器支持情况: Chromium(>=88)、Firefox(>=78)和Safari(>=14)都支持:is 和:where伪。...初识 :is() 和 :where() 这些都是功能性选择器,注意末尾()和它们以:开头方式。可以把它们看作是运行时动态函数调用,与元素相匹配。...uppercase; } /* nested */ .hero:is(h1,h2,:is(.header,.boldest)) { font-weight: 900; } 上述每个选择器例子都展示了这两个功能伪灵活性

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

ionic hybrid app:产品还是玩具?

(虽然严格来说ionic构建APP不是真正Native APP) 2. ionic安装和使用 关于ionic安装,在之前提到ouven一篇文章中有着较为详细介绍,这里不再重复。...上图描述了在安装好了ionic所有环境之后,如何通过ionic cli各个命令从零开始构建一个demo app。 3....Cordova还提供了一组统一JavaScript库,以及为这些库所用设备相关原生后台代码。...那这种App是否有成功产品(或者说成功产品能力呢?异或只是前端粉们一个即兴而作玩具? 4. ionic适用范围 对于上文中问题,ionic官方博客中专门有一篇文章有说明。...如果按照ionic对html5以及未来手机性能乐观展望,目前玩具说不定真能成为将来产品

5.5K80

ionic hybrid app:产品还是玩具?

(虽然严格来说ionic构建APP不是真正Native APP) 2. ionic安装和使用 关于ionic安装,在之前提到ouven一篇文章中有着较为详细介绍,这里不再重复。...上图描述了在安装好了ionic所有环境之后,如何通过ionic cli各个命令从零开始构建一个demo app。 3....Cordova还提供了一组统一JavaScript库,以及为这些库所用设备相关原生后台代码。...那这种App是否有成功产品(或者说成功产品能力呢?异或只是前端粉们一个即兴而作玩具? 4. ionic适用范围 对于上文中问题,ionic官方博客中专门有一篇文章有说明。...如果按照ionic对html5以及未来手机性能乐观展望,目前玩具说不定真能成为将来产品

3.2K10

十五种加速设计开发CSS框架

可实现代码重用:如果您正在从事一个大型项目的开发,其中包含无数页面,并且每个页面将处于持续活动与更新的话,那么代码重用将显得十分有用。可以说拥有强大重用特性框架,可以缩短您项目的准备周期。...通过支持具有“准系统结构(barebone structure)”流行框架,ZURB Foundation让用户能够使用简单方法及其入门模板,来快速生成产品原型。...由于提交量不少于14,000次,而且贡献者超过了940,因此ZURB在GitHub上也有着大量支持。目前,《华盛顿邮报》和《国家地理》等知名网站都使用是该框架。 4....另外,它还提供了30多种模块化组件,用户可以对其进行混合与匹配,以实现多种功能。也就是说,您不必反复搜索那些标记和。...Ionic带有直观UI组件,可协助用户加快网站或应用程序开发过程。由于提供了卓越原生功能和速度,Ionic可以与社区、主流分析平台、身份验证服务、插件以及其他集成平台,很好地配合使用。 11.

2.5K30

Web前端开发推荐阅读书籍、学习课程下载

学习路线 大部分技术,熟读下列四书籍,就是一个很好学习提升 入门,用浅显语言和方式讲述正确道理和方法 全面,巨细无遗地探讨每个细节,遇到疑难问题时往往可以在这里得到理论解答 实践,结合实际中经常遇到情景环境...第二批次 成为一合格前端工程师 (或) 。...白皮书 谷歌搜索引擎优化初学者指南 Web前端黑客技术揭秘 移动应用UI设计模式 构建高性能web站点 Web开发秘方  众妙之门 网站UI设计之道 好玩数学-数学演义 SEO艺术 SEO必知必会51...产品经理》1-33问 [引爆流行].马尔科姆·格拉德威尔.扫描版 《人人都是产品经理》电子书 欺骗艺术(中文) 《谁说菜鸟不会数据分析》 长尾理论(亚马逊畅销书榜经管第一) 《Facebook效应...$ionicPopup $ionicPopover $ionicLoading $ionicBackdrop 指令 35 ionic幻灯指令 ion-slide-box 36 APP产品原型设计工具(

12.6K71

混合应用开发框架Cordova源码学习总结

,当前行业应用主要是开发周期相对长,采用WEBVIEW方式来开发,在通用基础则框架基础上,则能缩短在UI上开发时间,提升交付效率;但对WEBVIEW开发应用体验提升,是我们当前需要解决最大问题...;采取策略是,基于Cordova便于Android层面的扩展,MUI则有丰富UI组建便于构建UI界面的基础,对于Android程序员来说,只需要安装标准控件编写html就可以,降低对js复杂度入门恐惧...Android 系统 ------------------- 开源框架  Cordova Cordova(前身是Phonegap),以及基于Cordova衍生框架,比方Ionic; Cordova是开源...构建混合移动应用用户界面框架,简单说是提供了一套基于AngularJSUI库。...依托Android原生WebView,Cordova库有源码,并提供了可扩展JS和本地库之间互相调用插件功能,便于后续扩展开发;但从WebView之间切换性能优化来看,体验不如原生应用,仅适合单页面的展示应用

81710

Spring Boot 之 MVC1、新建工程2、依赖更新3、编写Controller4、准备Model数据,映射请求路径5、配置JSP模版6、渲染输出

设置主页(Home page) 3 持久化数据保存 4 总结 Ionic 2 实现列表滑动删除按钮 1.创建Ionic2应用 2.准备列表数据 3.修改主页(HOME)模版 4.创建方法删除数据...我们需要一个列表 3.获取远程数据 4.推送数据到服务器 总结 Ionic 2 中样式与主题 Ionic 2主题简介 创建Ionic 2应用主题方式 没有苹果电脑打包iOS平台...Ionic 2程序 开始之前 1 创建一个Ionic 2应用 2 建立Ionic Cloud 3 生成证书和创建一个安全概要 4 使用Ionic Package 命令 总结 Ionic...在模版中使用 总结 Ionic 2 中创建一个闪视卡片组件 1. 创建一个新应用作为例子 2. 什么是组件? 3. 创建组件模版 4. 创建组件 5. 创建 CSS 动画 6....progress-bar/progress-bar.ts如下: 3.使用这个组件 总结 使用VS Code在Chrome中调试Ionic 2 优化你Ionic2应用 打开Angular产品模式

2.8K50

Ionic用于构建跨平台移动应用程序开源框架

Ionic框架和小程序容器技术可以结合使用,以在小程序平台上构建跨平台移动应用程序。...这种结合为开发者提供了更多选择和灵活性,能够同时享受到Ionic框架和小程序平台优势。 Ionic是一个用于构建跨平台移动应用程序开源框架。...图片跨平台潜能解锁:将Ionic框架与小程序容器相结合 市面上一些比较知名小程序容器技术产品包括:微信、支付宝、百度、抖音小程序等,他们都是以完善大社交平台自有小程序生态技术底座,能提供第三方进行私有化部署有...:FinClip、mPaaS等产品。...开发效率:Ionic框架使用Angular作为基础,借助Angular能力来构建复杂应用逻辑和数据绑定。

23810

Angular2、Ionic、TypeScript、es6关系?

除此之外,Angular团队还集成了Microsoft另外一个产品到Angular 2框架之中,这就是反应型JavaScript扩展(reactive JavaScript extension)RxJS...Advanced HTML5 Hybrid Mobile App Framework 是AngularJS 移动端解决方案 可以帮助您使用 Web 技术,比如 HTML、CSS 和 Javascript 构建接近原生体验移动应用程序...Ionic是一个新、可以使用HTML5构建混合移动应用用户界面框架,它自称为是“native与HTML5结合”。...,这个有两个Annotation,@Component和 @View,如果我们删除了所有的Annotation,剩下只是一个没有任何特殊意义?...Decorator Decorator是由Yehuda Katz提出 ECMAScript 7中建议标准,让你可以在设计时对属性进行注解和修改,这听起来很像annotation做事。

5.2K30

SNS项目笔记--项目启动

1.1、重新构建项目: 在https://nodejs.org/en/ 【官方网址】下载最新版本nodeJS,保证使用sass为4.5以上,这样在win7,8,10环境下可以满足编译环境,无需再做任何关于环境配置操作...统一化环境后即可开始我们项目构建。...效果图.png 这里ionic 很人性化给了几个选项进行筛选其各类项目分别是:1、tabs-->带底部导航栏项目;2、blank-->空项目;3、sidemenu-->默认主页面有侧滑栏项目;4、super...这些属性出现肯定是在scss里面进行设置,很多情况下会误认为在:项目/src/app/app.scss 里面,其实不然,经过一番苦苦寻找最终在: 项目/theme/variables.scss...改变点击色.png 4、结尾的话 作为公司项目此项目不应开源,但是我会在项目进行中将比比较精华部分分享给大家,希望同路人喜欢上这样UI框架,也希望ionic 在今后能改变我们大部分工作方式!

2.9K20

「葡萄城公开课」WijmoJS 前端开发工具包-新功能详解

葡萄城公开课 - 本期公开课介绍 WijmoJS 前端开发工具包由多款高效、灵活纯前端控件组成,全面支持 Angular、React、Vue、Type、Knockout 和 Ionic 框架,用于快速搭建企业级桌面...WijmoJS 可灵活应对客户需求变化,缩短新项目研发周期,高效处理海量用户数据,提升产品核心竞争力。...WijmoJS 凭借先进触控设计、全面的框架支持、顶级控件性能、零依赖产品特性和易用、轻松操作体验,全面满足前端开发所需,已成为构建企业 Web 应用程序最高效纯前端开发工具包。...OLAP 数据切片器及其功能增强 本期公开课嘉宾 本期公开课嘉宾由葡萄城 WijmoJS 产品锦鲤_李欣,为大家带来这场新版本发布会。...葡萄城控件和软件产品在国内外屡获殊荣,在全球被数十万家企业、学校和政府机构广泛应用。​

51560

每日前端夜话(0x05):2018年JavaScript状态调查(下)

Ionic GitHub 36k stars 使用开放式Web技术构建令人惊叹原生和渐进式Web应用。应用程序可以运行在任何设备上? Ionic 随时间流行度 ? Ionic 最受喜欢方面 ?...Ionic 最不受欢迎方面 ? 哪些工具与 Ionic 一起使用? ? 使用 Ionic 国家情况 平均而言,8.2%受访者使用过 Ionic ,并乐于再次使用它。...但事情远未解决:Airbnb最近发表了一系列文章,解释了为什么他们决定放弃React Native而转向Native Apps用于他们下一代产品。...React 有14417用户,React是今年最常用库。 Express 13532 Angular 11643 预测奖 最可能会替代其他技术新技术,不过也可能替代不了…… ?...这对我们来说是个坏消息,因为我们不能像过去那样对 React 提出激烈讨论,或者为一17岁越南高中生在业余时间编写了一个新库而感到兴奋。

2.1K40

合理使用CSS框架,加速UI设计进程

代码可重用:如果你项目是一个拥有很多页面的大型项目,并且后续仍在持续更新,那么框架使用将对你将很有用。可以说拥有强大重用特性框架,能明显缩短您项目的准备周期。...依靠ZURB Foundation支持具有“准系统结构”框架结构,可以让用户快速地完成产品设计原型。同时它在GitHub上也有大量支持,提交数量超过了14000个,贡献者也在940个以上。...这意味着您不必重复搜索标记和。 UI Kit与Bootstrap和Foundation等其他框架不同之处在于它没有使用将页面分为12列网格设置。...Bulma Bulma作为最常用框架之一,已经得到了超过15万开发人员支持。它是基于Flexbox免费开源框架之一。...它附带CSS可以在您构建网站时需要设置颜色、大小、位置等内容时为您提供极大帮助。Tailwind是为那些希望在网页设计方面拥有完全自由度开发人员而设计

1.9K20

【开发指南】(六)Ionic3从目录结构理解开发

命令钩子,用于编译和打包; node_modules:js库——node管理依赖包(通过命令npm install 包或路径安装); platforms:ios、android等可选平台生成原生项目...插件(通过ionic cordova plugins ls查看,通过ionic cordova plugins add/remove 插件或路径来添加/删除); resources :android...: ionic cordova resources 平台 命令可选参数为: --force, -f 强制重建资源; --icon, -i 创建图标资源; --splash, -s...components:自定义组件(公用、可复用模块); directives:自定义指令(注入到组件上为组件添加功能); pipes:自定义管道(用于格式化显示数据); providers:自定义服务(工具、...业务处理等等); 可以看到,每个目录有其职责,其中它们都是可选,基础项目为了方便你开始开发,除了components、directives、pipes、providers外都默认会为你创建,而这4个没创建是因为有些人就不需要用到

2.7K10

小米上市股价大涨,造就了这些亿万富翁!谷歌正式开源Jib;财富中国500强:京东夺魁互联网

或 Gradle 构建一部分运行。...● 可重现 - Jib 支持根据 Maven 和 Gradle 构建元数据进行声明式容器镜像构建,只要输入保持不变,就可以通过配置重复创建相同镜像。...Ionic 4.0.0-alpha.8 发布,新增 willChange 事件‍ Ionic 4.0.0-alpha.8 发布,Ionic Framework 是一个高级 HTML5 移动端应用框架...推送 iOS 11.4.1 中新增 USB 限制模式,目的是为了防止第三方公司通过 USB 方式破解 iPhone 并获取其中数据。‍...4、传今日头条母公司将于港股上市:估值 450 亿美元‍ 据今日晚间《华尔街日报》援引自知情人士消息,中国流行新闻聚合应用今日头条母公司字节跳动正在就今年内进行 IPO 一事进行磋商。

1.2K40

【Weex一瞥笔记】

ionic比较熟悉了,开始围观下其它框架,以比较下各自优缺点,这次先来是Weex。...当然weexpack项目也可以如下直接装weexpackCLI,通过该CLI构建及维护项目,只是weex-toolkit已经集成weexpack了,所以也不是必要。...也就是说修改配置文件,这里都不会动态变化,同时用Android Studio打开,包也是固定死是:com.weex.app。 我猜这是weexpackbug吧?应该不会一直存在。...目录结构 首先比较下weex和ionic目录,两者还是有点像,只是weex把ionic隐藏在node_modules里面的wabpack配置开放出来了,这样配置起来就灵活了一些。...4. 原生支持 可能刚接触不深,weex不建议但可以支持cordova,而且可以较方便集成原生第三方插件。反之,ionic只能支持cordova。

2.1K30

8个hybridapp开发工具_android hybrid

2.IONIC IONIC 是目前最有潜力一款 HTML5 手机应用开发框架。通过 SASS 构建应用程序,它提供了很多 UI 组件来帮助开发者开发强大应用。...Ionic框架目的是从web角度开发手机应用,基于PhoneGap编译平台,可以实现编译成各个平台应用程序。...4、APICloud APICloud是一款“云端一体”移动开发平台,信仰“云端一体”理念,重新定义了移动应用开发。...APICloud为开发者从“云”和“端”两个方向提供API,简化移动应用开发技术,让移动应用开发周期从一个月缩短到7天。...4、Appcelerator AppceleratorTitanium开发平台使开发者可以通过HTML、PHP、JavaScript、Ruby、Python等Web编程语言开发手机、平板和桌面的原生

2.1K10

前端Js框架汇总

寻了寻.net消息,也是振奋人心,.net core 1,mono,xamarin等等,但大多都还在狂吼阶段。其实一直以来对技术理解是技术服务于业务和产品产品又在不同程度推进着技术演进。...Ionic 是目前最有潜力一款 HTML5 手机应用开发框架。通过 SASS 构建应用程序,它 提供了很多 UI 组件来帮助开发者开发强大应用。...这些模板都是响应式,并且没有使用任何JavaScript。 用途:真的是很精美的一个样式框架,便于我们快事构建一些个人产品,当然也可以服务于工作中一些项目。...4.Ant Design 地址:http://ant.design/ 描述:一个 UI 设计语言,一套提炼和应用于企业级后台产品交互语言和视觉体系 三、可视化组件 1.Echarts 地址:http:...,Firefox,Safari等),底层依赖轻量级 Canvas 库ZRender,提供直观,生动,可交互,可高度个性化定制数据可视化图表。

6.4K30
领券