1、更改字体,图标大小小于12px无效的问题

若我们设置font-size:10px是不会有效果的,需要使用 transform: scale(0.68); 更改字体最小大小

2、设置div边框虚化,阴影效果 box-shadow: #E8E8E8 0px 0px 10px 0px;"

3、更改框架原有样式不生效问题

有的时候我们想更改某些前端框架自带的样式风格,发现设置样式不生效,这个时候就需要使用 ↓ 如下方式才能生效

  :host ::ng-deep .ant-card-body{ padding-top: 6px; } 

4、自定义谷歌浏览器滚动条样式

 .table_scorll_class {
/*css主要部分的样式*/ /*定义滚动条宽高及背景,宽高分别对应横竖滚动条的尺寸*/ ::-webkit-scrollbar {
width: 7px;
/*对垂直流动条有效*/
height: 7px;
/*对水平流动条有效*/
} /*定义滚动条的轨道颜色、内阴影及圆角*/
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 3px white;
background-color: #fff;
border-radius: 3px;
} /*定义滑块颜色、内阴影及圆角*/
::-webkit-scrollbar-thumb {
border-radius: 7px;
-webkit-box-shadow: inset 3px white;
background-color: #E8E8E8;
} /*定义两端按钮的样式*/
::-webkit-scrollbar-button {
background-color: #fff;
} /*定义右下角汇合处的样式*/
::-webkit-scrollbar-corner {
background: #fff;
}
}

记录几个常用的Css样式效果的更多相关文章

  1. (转载)记录函数 getStyle() 获取元素 CSS 样式

    设置元素(element)的css属性值可以用element的style属性,例如要将element的背景色设置为黑色,可以这么做: element.style.backgroundColor = ' ...

  2. 常用的 css 样式 记录

    1.font-style 属性指定文本的字体样式. 对应的值有: normal 默认值.浏览器显示一个标准的字体样式;  italic 浏览器会显示一个斜体的字体样式;  oblique  浏览器会显 ...

  3. 一些常用的CSS样式

    1. overflow: auto 允许盒子容器内容自动上下滚动 2. style="color:red solid" 设置元素边框样式 3.  white-space:nowra ...

  4. 常用的CSS样式示例代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 购物车css样式效果

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. css样式清零及常用类

    css样式清零及常用类 @charset "utf-8"; /*CSS Reset*/ /*"微软雅黑","\5FAE\8F6F\96C5\9ED1& ...

  7. CSS样式表(三)

    前端人员在学习开发过程中常用的CSS样式总结: [margin] margin 检索或设置对象四边的外延边距 margin-top 检索或设置对象顶边的外延边距 margin-right 检索或设置对 ...

  8. CSS样式的面向对象思想(一)

    今天来谈一谈CSS样式的面向对象写法.顾名思义,面向对象是高级语言具备的特性,主要是为了程序高可复用,解决模块之间的耦合关系,那么像CSS这样的脚本语言是否也可以使用面向对象的思想,来提高代码的可维护 ...

  9. ReactNative学习之css样式使用

    前言: 前面学习了html,今天学习一下css的基本使用,看下html与css之间是如何结合来编写前端网页的. CSS 是什么? CSS 是 Cascading Style Sheets(级联样式表) ...

随机推荐

  1. [人物存档]【AI少女】【捏脸数据】精灵

    AISChaF_20191101204710076.png

  2. 前端Web浏览器基于Flash如何实时播放监控视频画面(四)之使用videoJs‘拉流’

    本片文章只是起到抛砖引玉的作用,能从头到尾走通就行,并不做深入研究.为了让文章通俗易懂,尽量使用白话描述. 0x001: 下载videoJs 对于Video.js 5.x及更低版本,Flash技术(v ...

  3. HZOJ 20190719 那一天她离我而去(图论最小环)

    这题算是这场考试里最水的一道题了吧,就是求个最小环,但之前没练过,就在考场上yy出了最短路+次短路的傻逼解法,首先是不会求次短路,其次是这显然不对呀,自己随便想想就可以反驳这种解法. 正解比较神,但是 ...

  4. Nginx-rtmp直播之业务流程分析

    1. 综述 1.1 直播原理 使用 obs 向 nginx 推送一个直播流,该直播流经 nginx-rtmp 的 ngx_rtmp_live_module 模块转发给 application live ...

  5. js版的虚线框

    要求:实现鼠标点击面板的一个点,拖动到固定的位置,出现虚线框 样图:   具体的代码实现: js文件   <script> window.onload = function(){ docu ...

  6. windos批处理启动redis与哨兵

    为各个启动单独建立脚本后用总的bat调用 创建脚本,redis6379.bat脚本内容:@echo offtitle redis-serverset ENV_HOME6379="G:\Red ...

  7. HTML中meta=“viewport”的介绍

    viewport就是浏览器上用来显示网页的那部分区域 layout viewport:整个网页所占据的区域(包括可视也包括不可视的区域)  默认的 visual viewport:网页在浏览器上的可视 ...

  8. kernel hacking的一些网站

    很全面的网站,下面的网站基本都可以从该地址找到. 新手必备 subscrible/unsubscrible mail list mail list archive kernel git mainlin ...

  9. OpenCV学习笔记(12)——OpenCV中的轮廓

    什么是轮廓 找轮廓.绘制轮廓等 1.什么是轮廓 轮廓可看做将连续的点(连着边界)连在一起的曲线,具有相同的颜色和灰度.轮廓在形态分析和物体的检测和识别中很有用. 为了更加准确,要使用二值化图像.在寻找 ...

  10. HTML头信息标签和标题标签

    <html> <!-- 头信息的作用 1. 可以设置网页的标题. 2. 可以通知浏览使用指定的码表解释html页面. --> <head> <meta htt ...