css3root选择器，input标签中type怎么用css选择_CSS学习

资料来源：网络整理时间：2023/3/4 1:42:46 共计：3591 浏览

1、css3root选择器，input标签中type怎么用css选择？

可以用css3中新增的选择器“[attribute=value]”来同时选中指定的属性的标签。

1、新建html文档，添加5个input标签，其中第一个和最后一个“type”属性的属性值为“text”：

2、在head标签和body标签之间添加style标签，添加代码“input[type=text]”，“input”指的是标签名，“type”指的是属性名，“text”指的是属性值，这个就会把所有属性名为“type”、属性值为“text”的input标签选中：

3、为被选择的标签设置背景色为红色，这时属性值为“text”的第一个标签和最后一个标签背景色都变成了红色：

2、css3的transition是直接写在选择器上？

写在哪里是要分情况的，是要看你想要实现什么效果。

1）如果写在选择器，如果是写的rotate等事件，则直接执行事件，如果写的是transtion:all ease 0.5s，那么他在你鼠标移入以及鼠标移出的时候都会发挥作用。

2）写在hover上，那么他只会在鼠标移入的时候才执行你自己定义的transtion动作，移出没有效果；

3、用HTMLCSS和JavaScript写移动应用？

刚好看到这个问题，给你一些个人建议吧！

基础：HTML5、CSS3技术

对于一些简单的移动端项目，使用传统开发方式即可搞定。

jQuery

https://jquery.com/

Zepto.js

https://zeptojs.com/

mescroll - 精致的下拉刷新和上拉加载js框架，原生js, 不依赖jquery和zepto，支持vue/uniapp

http://www.mescroll.com/

Swiper - 移动端网页触摸内容滑动js插件

https://www.swiper.com.cn/

REM - CSS3新增的一个相对单位（root em，根em）Animate.css - 强大的预设css3动画库

http://www.jq22.com/demo/Animate201707101048/

Normalize.css - CSS reset的更优替代方案

http://necolas.github.io/normalize.css/

进阶：MVVM框架技术

对于一些进阶级移动端开发，可考虑使用MVVM框架技术。

如：Vue、React、Angular

Vue.js - 一套构建用户界面的渐进式框架

https://cn.vuejs.org/

https://github.com/vuejs/vue

React.js - 用于构建用户界面的 JavaScript 库

https://react.docschina.org/

https://github.com/facebook/react/

Angular - 一套框架，多种平台，移动端 & 桌面端

https://angular.cn/

https://github.com/angular/angular

这里为小伙伴们整理分享了一些vue、react移动端/pc端组件库，快速提升开发效率。

https://www.toutiao.com/i6832455087994962435/

https://www.toutiao.com/i6834426578668093956/

https://www.toutiao.com/i6836313110047883787/

https://www.toutiao.com/i6836775973447270915/

高级：跨端开发

对于一些高级的跨平台/多端开发，可考虑使用当下比较热门的跨端框架技术。

如：Ionic、Taro、uniapp、RN、Flutter

Ionic - 开源移动应用程序开发框架

https://ionicframework.com/

https://github.com/ionic-team/ionic

Taro - 京东JD多端统一开发框架

https://taro.jd.com/

https://github.com/NervJS/taro

uni-app - DCloud出品的前端应用的框架

https://uniapp.dcloud.io/

https://github.com/dcloudio/uni-app

React-Native - Facebook开源的跨平台移动应用开发框架

https://reactnative.dev/

https://reactnative.cn/

https://github.com/facebook/react-native

Flutter - 谷歌跨平台移动应用开发框架

https://flutter.dev/

https://flutter.cn/

https://flutterchina.club/

https://github.com/flutter/flutter

编码/调试工具vscode - 程序员的最爱

一款轻量且强大的跨平台开源代码编辑器，支持Windows，OSX和Linux。内置JavaScript、TypeScript和Node.js支持，而且拥有丰富的插件生态系统。

https://code.visualstudio.com/

hbuilderx

一款轻巧、极速编码工具(10M的绿色发行包)，强大的语法提示。

https://www.dcloud.io/hbuilderx.html

sublime

http://www.sublimetext.com/

notepad++

https://notepad-plus-plus.org/

Chrome、Firefox

https://www.google.cn/intl/zh-CN/chrome/

http://www.firefox.com.cn/

好了，以上就是个人的一些拙见，希望能对你和小伙伴们能有点点帮助！

4、和css中的选择器有什么区别？

这个是有区别的。

1、首先说两者是属于不同的两门语言，jquery是属于js的一个框架，则其选择器是js里面的选择器，css是另一门不同于js的语言，其选择器是css选择器，则两者在根本上是不同的。

2、但是两者是有交集的，都是作为网页或者浏览器解析的语言，而js可以通过修改浏览器的dom对象来实现对css修改或者是控制。

3、可以简单的这样区分两者，css选择器用语css当中，js选择器应用于js当中，只不过有时两者使用相同的id标识来选择对象。

版权说明：
本网站凡注明“广州京杭原创”的皆为本站原创文章，如需转载请注明出处！
本网转载皆注明出处，遵循行业规范，如发现作品内容版权或其它问题的，请与我们联系处理！
欢迎扫描右侧微信二维码与我们联系。

·上一条：css的选择器以及权重，CSS的基本特征_CSS学习 | ·下一条：css3选择器nthchild，css3中什么符号表示子代选择器_CSS学习