font | 易学教程

HTML CSS整理笔记(二）

阅读更多关于 HTML CSS整理笔记(二）

今天跟小常来给大家继续说一下HTML CSS整理笔记吧！一起来继续学习复习下吧，一起加油吧！小常说一下：今天要做的事不要等到明天,该自己做的事不要让别人做今天继续从CSS3美化网页开始说！ ——5 CSS3美化网页—— 32.CSS3设置文本样式： (1) 标签：用来设置行内元素(或几个文字)的样式。 (2)字体样式： font-size：常用单位px font-family：若同时设中英文字体，英文字体要设置在中文字体前面 font-style：normal标准、italic斜体、oblique倾斜 font-variant：small-caps; 字体设置为新型的大写字母，所有小写字母都转换为大写。 font-weight：normal标准、bold粗、bolder更粗、lighter细、100-900数字越大越粗 font：一次设置字体所有属性，顺序为"字体风格-粗细-大小-类型" 如 font:italic bold 36px “宋体”; (3)用font简写方式至少要指定 font-size和 font-family 属性，其他的属性(如font-weight、font-style、font-variant、line-height)如未指定将使用默认值。缩写时 font-size 与 line-height中间要加"/"斜扛如 “12px/1.5em” 32

python读取json文件

阅读更多关于 python读取json文件

json文件如下： [{ “fontFamily”: “微软雅黑”, “fontSize”: 12, “BaseSettings”:{ “font”:1, “size”:2 } } { “fontFamily”: “微黑”, “fontSize”: 22, “BaseSettings”:{ “font”:2, “size”:3 } }] import json def loadFont(): f = open("Settings.json", encoding='utf-8') //设置以utf-8解码模式读取文件，encoding参数必须设置，否则默认以gbk模式读取文件，当文件中包含中文时，会报错 setting = json.load(f) family = setting[0]['BaseSettings']['size'] //注意多重结构的读取语法 size = setting['fontSize'] return family t = loadFont() print(t) 来源： CSDN 作者： Enjoy lab and life 链接： https://blog.csdn.net/qq_33591712/article/details/84975268

【学习ios之路:UI系列】修改图片的尺寸大小操作

阅读更多关于【学习ios之路:UI系列】修改图片的尺寸大小操作

1.在添加图片操作时,通过UIImage对象进行添加图片操作 1.[UIImage imageName:@"1.png"] 2.[UIImage imageWithContentsOfFile:@"1.png"] 注:ImageNamed和imageWithContentsOfFile的区别 imageNamed加载图片并缓存，并且把image缓存到内存里面，当图片较少并且会频繁的使用时用imageNamed; imageWithContentsOfFile是只显示图片，但不加到内存中。所以加载大量图片的时候用imageWithContentsOfFile比较好，内存不会变大。在添加图片操作时,先对图片大小进行修改,操作如下 : 注:这里是UIImage的category扩展类 ①UIImage+Scale.h声明文件,传入一个CGSize参数,即图片的宽度和高度 <span style="font-size:14px;">- (UIImage *)scaleToSize:(CGSize)size;</span> ②.m文件,实现文件 <span style="font-size:14px;"> //指定缩减的大小 - (UIImage *)scaleToSize:(CGSize)size { // 创建一个bitmap的context //

移动端H5开发的屏幕适配方案

阅读更多关于移动端H5开发的屏幕适配方案

移动端屏幕的几个概念 1、什么是dpr？ dpr: device pixel ratio 设置像素比 —— dpr=物理像素/设备独立像素。设置独立像素：密度无关像素，个人理解：设备的实际屏幕大小物理像素：设备像素，显示设备中一个最微小的部件，个人理解：针对iphone retina屏幕，2倍的即屏幕用2px点来显示css为1px的内容，3倍的同理 2、获取设备dpr值 js获取方式： window.devicePixelRatio Css获取方式： -webkit-device-pixel-ratio, -webkit-min-device-pixel-ratio, -webkit-max-device-pixel-ratio （通过这个三个进行媒体查询，可对不同的dpr设置做一些样式适配，如对1px边框的处理问题上） 3、rem单位 rem: fontsize of root element 即相对于根标签 html的大小。例如当设置了html的font-size时为12px时，其他元素设置1rem则代表12px。屏幕适配的方案 1、简单版屏幕适配（windowWidth/设计稿宽*100） ——*100为了方便计算。即font-size值是手机deviceWidth与设计稿比值的100倍 document .getElementsByTagName( 'html' )

移动端屏幕适配的解决

阅读更多关于移动端屏幕适配的解决

随着手机硬件配置的飞速增长、屏幕尺寸的越来越大和网络带宽的逐渐提升，越来越多的PC业务和服务在向移动端转移。然而在这移动端的时代，为了处理各终端屏幕的适配，是否乱了手脚呢？https://hzzly.github.io/2017/03/15/%E7%A7%BB%E5%8A%A8%E7%AB%AF%E5%B1%8F%E5%B9%95%E9%80%82%E9%85%8D%E7%9A%84%E8%A7%A3%E5%86%B3/ 虽然移动端的页面与PC的页面相比简单了不少，但让我们头痛的事情还是要想尽办法让页面能适配众多不同的终端设备。在前几个外包项目中，我做的主要都是移动微信端的。期间也遇到了不同屏幕大小的适配问题，所以今天特来分享一下我的解决方法。项目地址： https://github.com/hzzly/xyy-vue demo地址： http://hjingren.cn/xyy-vue/ 欢迎大家的star啦~ 一、meta标签 meta之viewport，其主要用来告诉浏览器如何规范的渲染Web页面，而你则需要告诉它视窗有多大。在开发移动端页面，我们需要在html中设置meta标签如下： 1 < meta name = "viewport" content = "width=device-width, user-scalable=no, initial-scale=1.0,

邮件中如何写html

阅读更多关于邮件中如何写html

StringBuilder stringBuilder = new StringBuilder();利用StringBuild对象将写好样式的表单或者表格用append方法添加，最后用stringBuilder.toString()方法即可转为实际页面注意将所有值的空格全部替换成" "否则，有空格的值无法读取完整信息。 stringBuilder.append( "<body style=\"background:#CEFFCE\">\n"+ "<form>\n"+ "<div style=\"text-align:right\">\n"+ "<label style=\"font-family:微软雅黑;font-size:13px\">Date Reported:</label><input type=\"text\" style=\"width:400px;margin:3px 0px 3px 0px\" value="+((String)param.get("RPT_DTE")).replace(" ", " ")+"><br/>\n"+ "<label style=\"font-family:微软雅黑;font-size:13px\">Your Name:</label><input type=\"text\" style=\"width:400px;margin

移动端页面

阅读更多关于移动端页面

1.引入jquery.js和adaptive.js adaptive.js (function (win, lib) { var doc = win.document; var docEl = doc.documentElement; // 设备像素比 var devicePixelRatio = win.devicePixelRatio; // 我们设置的布局视口与理想视口的像素比 var dpr = 1; // viewport缩放值 var scale = 1; // 设置viewport function setViewport() { // 判断IOS var isIPhone = /iphone/gi.test(win.navigator.appVersion); // 布局视口与理想视口的值与设备像素比相等只针对iphone if (isIPhone) { // if (devicePixelRatio >= 3) { // dpr = 3; // } // else if (devicePixelRatio === 2) { // dpr = 2; // } // else { // dpr = 1; // } // } // else { dpr = 1; } // window对象上增加一个属性，提供对外的布局视口与理想视口的值 win

手机端页面时，字体的显示大小与在CSS中指定的大小不一致

阅读更多关于手机端页面时，字体的显示大小与在CSS中指定的大小不一致

最近在做一个手机端页面时，遇到了一个奇怪的问题：字体的显示大小，与在CSS中指定的大小不一致。大家可以查看这个Demo（记得打开Chrome DevTools）。就如上图所示，你可以发现，原本指定的字体大小是24px，但是最终计算出来的却是53px，看到这诡异的结果，我心中暗骂一句：这什么鬼！随后开始对问题各种排查：某个标签引起的？某个CSS引起的？又或者是某句JS代码引起的。通过一坨坨的删代码，发现貌似都不是。我不禁又骂，到底什么鬼！不过中间还是发现了一些端倪：当页面中的标签数量或者文本数量大于某一个值，或者当CSS定义的字体大小落在某个区间时，这个问题才会被触发。而且字体变大后的值也随着原始定义的字体大小而改变。然后自然就是各种搜索，终于有了新的发现。原来这个特性被称做「Text Autosizer」，又称「Font Boosting」、「Font Inflation」，是 Webkit 给移动端浏览器提供的一个特性：当我们在手机上浏览网页时，很可能因为原始页面宽度较大，在手机屏幕上缩小后就看不清其中的文字了。而 Font Boosting 特性在这时会自动将其中的文字字体变大，保证在即不需要左右滑动屏幕，也不需要双击放大屏幕内容的前提下，也可以让人们方便的阅读页面中的文本。不过这个特性并不总是有必要的，还好在查到问题原因的同时，大家也讨论了对这个问题的一些处理方案：

谷歌浏览器移动端部分字体大小与设定大小不同

阅读更多关于谷歌浏览器移动端部分字体大小与设定大小不同

问题描述：为了适配各种移动端设备，动态设置了viewport缩放，然后动态设置html的font-size大小，用rem布局。但是在谷歌浏览器中查看的时候出现了问题 1.这个没问题，font-size设置的.28rem，所以换算成px应该是.28*100=28px；OK，没毛病，但是下面那行字就很大了。。 2.同样是设置.26rem字体大小，按理说应该是26px，但是浏览器里显示的是37px？？？这是什么鬼，火狐浏览器一切正常。于是百度原因，就在于webkit的 Font Boosting 。解决方法：参考：解决移动端字体大小与设定大小不同的问题 Computed font size is bigger than defined in CSS on the Asus Nexus 7 来源： CSDN 作者： jojo付啾啾链接： https://blog.csdn.net/DreamFJ/article/details/83506083

手机默认字体大小改变后页面布局错乱的处理方法

阅读更多关于手机默认字体大小改变后页面布局错乱的处理方法

(function(doc, win) { // 用原生方法获取用户设置的浏览器的字体大小(兼容ie) if(doc.documentElement.currentStyle) { var user_webset_font=doc.documentElement.currentStyle['fontSize']; } else { var user_webset_font=getComputedStyle(doc.documentElement,false)['fontSize']; } // 取整后与默认16px的比例系数 var xs=parseFloat(user_webset_font)/16; // 设置rem的js设置的字体大小 var view_jsset_font,result_font; var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', clientWidth, recalc = function() { clientWidth = docEl.clientWidth; if(!clientWidth) return; if(!doc.addEventListener) return; if

订阅 font