[Web前端基础] CSS优先级、JS运算优先级、CSS设置在第几行进行超出部分省略号、JS设置元素样式的六种方式

2023-11-17

CSS优先级

!important> 行内样式 > id选择器 > 类选择器 > 标签选择器 > 通配符选择器 > 继承

如果有多个复合选择器选中同一个元素,则需要通过权重计算确定优先级:

在这里插入图片描述
挡住的是:标签选择器的个数

注意:只要是继承来的CSS样式,优先级都是最低的,继承的样式加了 !important 也没用。

因为 !important 无法被继承

JS运算优先级

括号 > 点运算符 > 一元运算符 > 算数运算符 > 比较运算符 > 逻辑运算符 > 赋值运算符

点运算符即打点操作,取值或者执行某个方法等;

一元运算符:即自增自减(前++、后++、前- -、后- -)

算数运算符:即加减乘除取模(+ - * / %)

比较运算符:即大于、小于、等于、全等、非全等,也叫关系运算符

逻辑运算符:即与、或、非(&&  ||  ! )

赋值运算符:即( =  +=  -=  *=  /=  %= )

全换成具体符号后:

() > . > ++ -- > + - * / % > == <= >= === !=== > && || ! > = += -= *= /= %=


CSS设置第N行超出部分省略号

代码:

overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;

先设置盒子溢出部分隐藏

display: -webkit-box; 为设置当前盒子为弹性伸缩盒子(这个解释可能有谬误)。

-webkit-box-orient 为设置盒子的文本排列方式,vertical为垂直排列

-webkit-line-clamp 为设置在第几行进行超出部分显示省略号


JS设置元素样式的六种方式

1. 对象.style
2. 对象.className = "类名"
3. 对象.setAttribute("style","样式")
4. 对象.setAttribute("class","类名")
5. 对象.style.setProperty("css属性","css属性值")
6. 对象.style.cssText = "样式"
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

[Web前端基础] CSS优先级、JS运算优先级、CSS设置在第几行进行超出部分省略号、JS设置元素样式的六种方式 的相关文章

随机推荐

  • ReID专栏(三) 注意力的应用

    前言 本文中提出了一种用于行人重识别的注意感知特征学习方法 该方法由一个部分注意分支 PAB 和一个整体注意分支 HAB 组成 并与基础再识别特征提取器进行了联合优化 由于这两个分支建立在主干网络上 因此没有为ReID特征提取引入额外的结构
  • 客户管理系统CRM表格版,含销售合同客户关系维护等功能

    客户管理系统CRM表格版 含销售合同客户关系维护等功能 系统由EXCEL开发 绿色安全 简单好用 送VBA宏插件编号 139653845009471设计师儿
  • 来自国际大厂Cloudflare的免费项目cloudflared

    在此之前 大家可以先去看看项目 https github com cloudflare cloudflared 事先声明 本人使用Ubuntu2204系统搭建 理论上适合Debian系Linux系统 Redhat系需要修改相关命令 其他系统
  • super和this关键字

    一 super关键字的应用场景 1 访问父类的成员变量 2 访问父类的构造函数 3 访问父类的方法 二 super关键字的使用 class Animal protected String name 注意 若限定符是private 子类无法使
  • 项目中都要掌握的BAPI之过账BAPI “ BAPI_ACC_DOCUMENT_POST”

    SAP FI 会计凭证过账 BAPI ACC DOCUMENT POST 该过账BAPI需要和模拟过账的BAPI BAPI ACC DOCUMENT CHECK 搭配使用 这样先执行模拟过账 成功了再执行真正的过账 这样就不会因为执行失败产
  • OpenGL加速渲染:显示列表glGenLists

    在OpenGL中 可能要用非常多的点 线 面来构成一幅图 若进行实时渲染 无疑对显示效率有非常大的影响 比如要画几百万个三角形 那么很可能旋转一下图片需要响应很久 为了加速渲染 可以将需要绘制的部分放在显示列表glGenLists中 每一个
  • git仓库完整迁移(代码,分支,提交记录)

    背景 我们公司使用Git进行版本控制 并使用gitlab搭建了公司的私有Git仓库 后期项目逐渐增多 项目老大为了统一项目权限管理 决定将不同项目统一放到一个Group中 一旦进行项目迁移 项目的git远端地址会发生变化 现在项目正在开发当
  • JavaScript单向链表结构

    JavaScript单向链表结构 h1 见控制台打印 h1
  • 手把手教你使用WinPwn自制iPhone固件

    Pwn破解软件系列的windows版本终于发布 我们可以用这个软件在PC上制作自己的iPhone自制固件 不过根据开发小组介绍这个版本还属于测试版本 某些功能还不能实现 因此破解时需使用Installer下的Bootneuter 详细操作流
  • git常用命令记录

    git常用命令记录 git常用命令 接上一篇搭建hexo github的博客 几次修改文件导致博客无法正常运行 故上传github 备份之 也就有了这篇文章 介绍基本的git命令 git config global user name 你再
  • 股票为什么会涨停?

    原文地址 http news xinhuanet com stock 2004 02 17 content 1318785 htm 股票为什么会涨停 要回答这个问题 有必要先说清楚什么是停板 停板是股票市场中的一种游戏规则 它是为了防止股票
  • 学习C# 哈希表(HashTable)用法

    学习C 哈希表 HashTable 用法 1 哈希表 HashTable 简述 在 NET Framework中 Hashtable是System Collections命名空间提供的一个容器 用于处理和表现类似keyvalue的键值对 其
  • list要点

    基本操作 erase函数 remove函数 特殊变动性操作 List迭代器 list与vector 异常处理 list本质是一个双向链表 其模板定义如下 namespace std template
  • 刷脸支付秒过地铁太快太方便

    刷脸支付让人们生活更便捷 公交卡 零钱 手机统统不用带 在广州 坐地铁只要刷脸就可以啦 据媒体报道 近日 广州首个智慧地铁站开通 乘客可以刷脸无感过闸 300毫秒内完成人脸识别 每分钟可通行40人 几年前 刷脸 还是朋友间用来互相调侃的 转
  • 给服务器端的.git瘦身

    一 背景 git库擅长管理文本型的文件 二进制文件一版不建议用git管理 现在我们已经用git管理的二进制文件 并且已经有了上百个提交 多个分支 且存储的二进制文件的总和已经相当庞大 可能几十个G 上百G 这给我们的git管理带来了以下3问
  • 嵌入式C语言之位操作详解

    1 位操作符 位操作直接将两个操作数按照二进制对应进行操作 例 0xaa 位与 0xf0 0xa0 逻辑操作是 两个操作数整体来操作 例 0xaa 逻辑与 0xf0 1 嵌入式的移位操作针对于无符号数 左移时右侧补0 右移时左侧补0 相当于
  • Python爬虫从入门到精通:(12)cookie_Python涛哥

    什么是cookie 是存储在客户端的一组键值对 web中cookie的典型应用 免密登陆 cookie和爬虫之间的关联 sometime 对一张页面进行请求的时候 如何请求的过程中不携带cookie的话 那么我们是无法请求到正确的页面数据
  • P5731 【深基5.习6】蛇形方阵

    题目描述 给出一个不大于 9 的正整数 n 输出n n 的蛇形方阵 从左上角填上 1 开始 顺时针方向依次填入数字 如同样例所示 注意每个数字有都会占用 3 个字符 前面使用空格补齐 输入格式 输入一个正整数 n 含义如题所述 输出格式 输
  • VMware虚拟机安装Linux 系统步骤

    一 获取安装包与系统镜像 VMware安装包下载 直接去访问我之前的博客 安装VMware虚拟化软件 何妨呀 的博客 CSDN博客 分享两个系统镜像资源库 下载Linux系统镜像 清华大学开源镜像站 清华大学开源软件镜像站 Tsinghua
  • [Web前端基础] CSS优先级、JS运算优先级、CSS设置在第几行进行超出部分省略号、JS设置元素样式的六种方式

    CSS优先级 important gt 行内样式 gt id选择器 gt 类选择器 gt 标签选择器 gt 通配符选择器 gt 继承 如果有多个复合选择器选中同一个元素 则需要通过权重计算确定优先级 挡住的是 标签选择器的个数 注意 只要是