最近不想聊具体的技术了，过年了聊点轻松的东西。但是又不想偏离编程太远，所以我今天聊聊我们常用的一些编程字体。...在阅读代码的时候眼睛需要以不同寻常的方式移动（垂直和水平方向），这与书籍类阅读有很大的不同（通常沿着同一方向的文本而滑动）。所以字体也是生产力的组成部分。接下来介绍我一些常用的字体。 2....Fira Code 是 Mozilla 提供的字体，它基于 Fira Mono 等宽字体的一个扩展，主要特点是加入了编程连字特性，注意上图中的 -> 符号。如果感觉不明显来看看我们常用的几个： ?...这个是 Intellij Idea 某次更新提及的字体，我试用了一下还不错，这是为 Android 设计的一种字体，很漂亮，但是 0 和 O 并没有区分，这个是最大的缺陷，相信很多同学会因为这个而放弃它...所以上面的可能符合一些同学的口味，也可能不符合另一些同学的口味，所以我这里还有一个黑科技网站 编程字体[1]。你可以从中挑选其它适合你的字体。
书写上一定要注意啊，加减号两边一定要有空格 任何长度值都可以使用calc函数进行计算:% vh vw px em等 calc函数使DOM元素更加灵活的响应视口改变，还可以通过calc函数实现元素的绝对剧中定位...相当于min(MIN,min(max,MAX)) 变量使用(var函数) CSS声明变量，需要在声明的变量前加两根连接线：--,需要注意变量名大小写敏感。...利用css动态根据页面变化导致的规则变化，可以在响应式布局中使用media声明全局变量，使得不同的屏幕宽度有不同的变量值。...line-gradient 用于创建一个线性渐变的图像，需要设置起点的方向和渐变的起始颜色。 未设置方向，默认是从上到下。...postion:默认值是中心点，支持关键字，支持距离左上角的角标位置(px或百分比单位) .radial_1 { /*最简单的渐变：由中心到四周，由蓝色到黄色*/ background-image
作为前端开发，体验和美感很重要，创造美的生活，每篇的文章会发一张自认为美的艺术的图片，与诸君共享，如果觉得文章对您有帮助，欢迎赞助我们 一. css 2.x code 1....鼠标不允许点击： cursor:not-allowed; 9. mac font: osx平台字体优化 font-family:"Hiragino Sans GB","Hiragino Sans GB...GradientType=0,startColorstr='#50000000',endColorstr='#50000000')\9; 看哪个startColorstr和endColorstr，一共8位，后6位是RGB的颜色代码...@media screen and (max-width:1220px) and (min-width:1151px) { #wrapper {font-size:15px;}} 有全部浏览器的兼容代码生成...CSS 实现 textArea 的 placeholder 换行 5.阻止默认事件 pointer-events:none; 6.
废话 不少博主喜欢美化自己的博客，而一个好看的字体可以让人眼前一亮，还可以提高阅读舒适度。作为一个二次元类（伪）的博客怎么能没有一个可爱的字体呢？...正文 我在网上也找了些教程，但是大部分代码错误或者是外部链接用不了。...所以这里Daimon分享一下自己用的字体css（更换字体可以自己用github+jsdiver上传自己喜欢的字体，这样可以缓解服务器压力，毕竟宽带小的服务器加载几mb的字体还是略微吃力）。...具体效果看本站字体就行了(๑╹ヮ╹๑)ﾉ 教程开始： 首先进入你网站后台打开侧边栏→外观→自定义→额外CSS。...然后将下面代码复制粘贴进去，然后发布就可以了(´∇ﾉ｀*)ノ @font-face { font-family: 'moonbridge'; src: url('https://cdn.jsdelivr.net
1 #eff99cc#K 自创黑色字体裹着一层粉色粉红蕾丝 2 #ecc33cc#cff9966 外红内浅粉色 3 #e330066#cff99ff 外紫内浅红 4 #u#b#eff99cc...最简单的加闪加下横线的纯粉白字体我自己用的就是去掉#b而已 5 #effffff#cff99ff 还是粉色粉色打亮白色的那种。。。...6 #eFF3399#cff99cc 还是粉色的桃红分里面浅的 7 #eFF99CC#c330066#b 额原谅我的审美眼光。。。...喜欢的抱走嘻嘻 4 #e9966ff 很明媚的紫色 5 #gf88fcc#u#gf47fcc#u 感觉是石榴籽的颜色打起来有点麻烦因为这个字体只能用一次 下次用的时候它的后半截会掉额。。。...很亮、渐变的底部比较浅 10 #ed7ffff#c0b38ba 涵妹妹经常用这个颜色外蓝内蓝 版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。
Windows的中文字体： 黑体：SimHei 宋体：SimSun 新宋体：NSimSun 仿宋：FangSong 楷体：KaiTi 仿宋_GB2312：FangSong_GB2312 楷体_GB2312...：KaiTi_GB2312 微软雅黑：Microsoft YaHei 英文字体： PmingLiu Impact Georgia Tahoma Arial Book Antiqua Century Gothic
分享css 填坑常用代码 以下是常用的代码收集，没有任何技术含量，只是填坑的积累。转载请注明出处，谢谢。 一. css 2.x code 1....='#50000000',endColorstr='#50000000')\9; 看哪个startColorstr和endColorstr，一共8位，后6位是RGB的颜色代码...); ie10渐变 http://www.iefans.net/ie10-yulanban-css3-jianbian/ alpha透明兼容代码生成： http://leegorous.net...wrapper {font-size:15px;} } http://www.colorzilla.com/gradient-editor/ 有全部浏览器的兼容代码生成...http://segmentfault.com/a/1190000000362621 CSS 实现 textArea 的 placeholder 换行
demo1:css实现颜色变化 效果如图所示 实现代码如下 <!...实现鼠标悬停炫酷效果 效果如图所示（有动画效果） 代码如下 <!...orange, #70f7fe, #fbd7c6, #fdefac, #bfb5dd, #bed5f5); color: transparent; /*设置字体颜色透明...，整理出来的css样式，虽然现在还看不太懂，因为css真的博大精深，但是能够看得懂，然后修改成自己想要实现的效果，那就OK了，至于学的话，慢慢来。...ps:这是自己使用css实现的博客效果图
HI，五一玩的怎么样？除了人山人海，高速堵车，高铁全是人之外其他都还好啦，是不是，哈哈哈~~~好了，不闹了，在假期有朋友问我，想要修改网页的字体怎么办？怎么更换网页的字体，又如何引用自定义字体呢？...首页我们要引用字体文件代码，代码参考如下： @font-face { font-family: 'talklee'; font-display: swap; src: url('....WOFF：转为web字体指定的字体格式标准，被新版本浏览器广泛支持。 确保链接正确，建议在采用的是相对路径，当然大家也可以使用绝路径。...PS：获取@font-face所需字体格式，特殊字体已经在你的电脑中了，现在我们需要想办法获得@font-face所需的.eot,.woff,.ttf,.svg字体格式。...，只需要字体文件，其他文件和css都不需要的。
开本系列，谈谈一些有趣的 CSS 题目，题目类型天马行空，想到什么说什么，不仅为了拓宽一下解决问题的思路，更涉及一些容易忽视的 CSS 细节。...谈谈一些有趣的CSS题目（一）-- 左边竖条的实现方法 谈谈一些有趣的CSS题目（二）-- 从条纹边框的实现谈盒子模型 谈谈一些有趣的CSS题目（三）-- 层叠顺序与堆栈上下文知多少 谈谈一些有趣的CSS...题目（四）-- 从倒影说起，谈谈 CSS 继承 inherit 谈谈一些有趣的CSS题目（五）-- 单行居中，两行居左，超过两行省略 谈谈一些有趣的CSS题目（六）-- 全兼容的多列均匀布局问题 谈谈一些有趣的...CSS题目（七）-- 消失的边界线问题 谈谈一些有趣的CSS题目（八）-- 纯CSS的导航栏Tab切换方案 谈谈一些有趣的CSS题目（九）-- 巧妙的实现 CSS 斜线 谈谈一些有趣的CSS题目（十）-...等宽字体是指字符宽度相同的电脑字体，常见于 IDE 或者编辑器中，每个字母的宽度相等，通常用于计算机相关书籍中排版代码块。 ?
我们这些苦逼的程序员在工作中，每一个老板都希望我们都能把手头的工作做好的，而且是越快越好，那我们要怎么样才能快起来呢？...对于开发中常用的代码块无限复做是我们工作中简省时间最有效的途径之一，而下面的这些代码就是我们在开发出现概率较多的开发中常用的代码块： 一、 隐藏软键盘的输入法 InputMethodManager...; mInputMethodManager.hideSoftInputFromWindow(view.getWindowToken(), 0); 二、判断网络是否是好的 ...filePath.exists()) { filePath.mkdirs(); } } } 五、获取网络文件的总大小 ... int day = (int) (time / (24 * 60 * 60 * 1000)); return day; } 九、android判断应用是否是内置的
你是否早已厌倦了司空见惯的Helvetica字体？想让你的网页别有一番趣味？或是想避免和同事讨论这些琐事？那么我想你需要看看下面这些代码。...在项目中添加这样一小块代码后，将在全局中将Helvetica字体替换（alias）为Comic Sans MS字体（或是Chalkboard SE字体，取决于浏览器支持）。...需要的注意的是，一些族关键字是无法覆盖的，例如： serif， sans-serif， cursive， fantasy以及 monospace。...接下来让我们通过一些简洁明了的demo和测试用例来更好的理解一下 更新：我之后不久发现System Font CSS项目在2015年使用了这种方法，好像早于Facebook的实现 实例演示 注：下面的demo...同样也不再需要在你的CSS中为 font-family属性赋其他杂乱的值了。简单而有效！
在制作页面时，经常会遇到需要自定义一些标签的默认行为(如：input的占位符等)，但这些默认的设置的css一般比较难记住,所以有必要自己做一下记录。下面是我经常用到的一些重设默认行为的css。...1、占位符 在 标签中设置 placeholder 属性时，有时候因为需求，要修改占位符的默认颜色或者字体大小，这是就可以用下面的css: // firefox input::-...去掉小三角的css： -webkit-appearance: none; -moz-appearance: none; 在IE浏览器中目前还没找到可以去掉小三角的方法。...3、input[type=number]右边的spinners nput[type=number] 通常用在移动端设备上，浏览器会识别number输入类型，然后改变数字键盘来适应它。...去掉spinners的css如下： // firefox input[type='number'] { -moz-appearance:textfield; } // chrome input[type
Y-offset:指阴影居于字体垂直偏移的位置。 Blur:指阴影的模糊值。...transforms 或者 animations时可能会有页面闪烁的效果，下面的代码可以修复此情况： .cube { -webkit-backface-visibility: hidden;...44、CSS不同单位的运算 css自己也能够进行简单的运算，主要是用到了calc这个函数。...（常用） none: 保持原有尺寸比例。同时保持替换内容原始尺寸大小。...同时需要注意的是line-height的高度基于font-size（即字体的高度），如果文字要转行会出现异常哦。 本文完~
一 CSS文字属性： color : #999999; /*文字颜色*/ font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; /*文字大小*/...font-style:itelic; /*文字斜体*/ font-variant:small-caps; /*小字体*/ letter-spacing : 1pt; /*字间距离*/ line-height...注 意：如果做页面间的切换效果，可以在区加上一行代码：<Meta http-equiv=Page-entercontent=revealTrans(Transition=?...Strength：设置波浪摇摆的幅度。 16. Xray：显现图片的轮廓，X光片效果 注意：在使用CSS滤镜时，必须使用在有区域的元素，比如表格，图片等。...而文本，段落这样没有区域的元素不能使用CSS滤镜，对这样的元素我们可以设置元素的Height和Width样式或坐标来实现。"
content=”网页描述” /> 小海绵就是我呀丨by：xiaohaimian 行内元素：行内元素会在一条直线上排列，都是同一行的，...块级元素从新行开始结束接着一个断行丨块级元素可以包含行内元素和块级元素丨行内元素与块级元素属性的不同，主要是盒模型属性上 <p>段落 <h1>h1...如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
自己平时整理的一些常用的 CSS 样式 设置透明度 在IE6中使用 filter: alpha(opacity = 40); 在其他浏览器中使用 opacity: 0.4; 设置行高 /*\9表示兼容所有的...child { position: absolute; left: 0; right: 0; top: 0; bottom: 0; } 使用绝对定位加CSS3...important; } 响应式布局中屏幕尺寸的表示 这里是以 iView 框架为例，不同框架的尺寸值可能不一样 xs 超小屏幕 手机 (<576px) sm 小屏幕 平板 (≥576px...) md 中等屏幕 桌面显示器 (≥768px) lg 大屏幕 大桌面显示器 (≥992px) xl 超大屏幕 (≥1200px) xxl 超级大屏幕 (≥1600px) 设置标签的高度为浏览器窗口的高度...转载请注明： 【文章转载自meishadevs：常见的CSS样式兼容性写法】
原文 - 黑白图像 这段代码会让你的彩色照片显示为黑白照片，是不是很酷？...下面这个简单的 css3 代码片段可以给网页加上漂亮的顶部阴影效果： body:before { content: ""; position: fixed;...使用负的 nth-child 选择项目 在CSS中使用负的 nth-child 选择项目1到项目n。...优化显示文本 有时，字体并不能在所有设备上都达到最佳的显示，所以可以让设备浏览器来帮助你： html { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing...对纯 CSS 滑块使用 max-height 使用 max-height 和溢出隐藏来实现只有CSS的滑块： .slider ul { max-height: 0; overlow: hidden
常用的CSS框架 之前在写自己的个人网站的时候，由于自己Web前端不是特别好，于是就去找相关的CSS框架来搭建页面了。...找到以下这么一篇文章(列出了很多常用的CSS框架)： http://w3schools.wang/report/top-UI-open-source-framework-summary.html Bootstrap...Iview Layui Mui Frozenui AlloyUI W3.CSS 本篇主要是记录我用过的CSS框架，并把之前写过的笔记进行整合一下。...这里写图片描述 easyUI就是一个在Jquery的基础上封装了一些组件….我们在编写页面的时候，就可以直接使用这些组件…非常方便…easyUI多用于在后台的页面上… 在学习easyUI之前，我已经学过了...easyUI快速入门 首先我们得去下载easyUI的资料… 然后在我们把对应的文件导入进去项目中，如下图： ? 这里写图片描述 在html文件的body标签内，写上如下的代码： <!
圆角 -moz-border-radius: 6px; /* Mozilla浏览器的私有属性 */ -webkit-border-radius: 6px; /* Webkit浏览器的私有属性 */ border-radius.../images/arrow_up.png') center center no-repeat; 禁用li样式 list-style: none; 字体 font-family: "Microsoft YaHei
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
对象存储
云直播
