font

1.技术选型 方案：我们采取单独制作移动页面方案 技术：布局采取rem适配布局（less+rem+媒体查询） 设计图：750px设计尺寸 2.搭建相关文件夹结构 css/images/upload/index.html 3.设置视口标签\引入初始化样式 <meta name="viewport" content="width=device-width, initial-scale=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0"> 4.设置公共common.less文件 1.新建common.less 设置好最常见的屏幕尺寸，利用媒体查询设置不同的html字体大小，因为除了首页其他页面也需要 2.尺寸320px.360px,375px,384px,400px,414px,424px,480px,540px,720px,750px 3.划分15等分 4.pc端也可以打开，so html设置字体大小为50px //设置常见的屏幕尺寸。修改里面的html文字大小 //划分为15em @number:15; //320 @media screen and (min-width:320px){ html{ font-size: 320px / @number; } } //360 @media screen and (min

问题描述： 在django的views.py视图中定义视图函数生成二维码并返回给网页，生成验证码过程中发生错误，如下： TypeError: string argument expected, got 'bytes' Traceback (most recent call last): File "G:\anaconda\lib\site-packages\django\core\handlers\exception.py", line 34, in inner response = get_response(request) File "G:\anaconda\lib\site-packages\django\core\handlers\base.py", line 115, in _get_response response = self.process_exception_by_middleware(e, request) File "G:\anaconda\lib\site-packages\django\core\handlers\base.py", line 113, in _get_response response = wrapped_callback(request, *callback_args, **callback_kwargs) File "F:

HWND static_ = CreateWindow(L"STATIC", NULL, WS_CHILD | WS_VISIBLE | SS_LEFT, 100, 100, 100, 16, hWnd, NULL, hInst, NULL); LOGFONT font; font.lfHeight = 16; font.lfWidth = 0; font.lfEscapement = 0; font.lfOrientation = 0; font.lfWeight = FW_BOLD; font.lfItalic = true; font.lfUnderline = false; font.lfStrikeOut = false; font.lfEscapement = 0; font.lfOrientation = 0; font.lfOutPrecision = OUT_DEFAULT_PRECIS; font.lfClipPrecision = CLIP_STROKE_PRECIS | CLIP_MASK | CLIP_TT_ALWAYS | CLIP_LH_ANGLES; font.lfQuality = ANTIALIASED_QUALITY; font.lfPitchAndFamily = VARIABLE_PITCH | FF_DONTCARE; HFONT

针对近日华为，小米的部分机型，在升级系统或升级微信之后，微信内置浏览器产生的rem不能正确填充满的问题，有如下解决方案 目前来看，产生这个情况的原因是因为给html附font-size时，附上的font-size和实际上html的font-size 大小并不一致 如图： 在问题机型上展示的三个值 分别为 1.机型最终附给html的font-size大小 2.我想赋给html的font-size大小 3.二者的倍数 尝试找了多个问题机型，最终的比例都是1.25左右（1.24999），所以解决方案如下 //针对机型适配的代码就不贴了 网上随手一搜一堆 这里就针对特殊机型的处理展示一下 var docEl = doc.documentElement, setFontSize = function () { var clientWidth = document.documentElement.clientWidth, timer; if (!clientWidth) return ; 　　　　　　 //原本对于html的字号设置 我这里用的是750的标准 ，640的也是同理 docEl.style.fontSize = 100 * (clientWidth / 750) + 'px' ; 　　　　　　 if (window.getComputedStyle(document

针对近日华为，小米的部分机型，在升级系统或升级微信之后，微信内置浏览器产生的rem不能正确填充满的问题，有如下解决方案 目前来看，产生这个情况的原因是因为给html附font-size时，附上的font-size和实际上html的font-size 大小并不一致 如图： 在问题机型上展示的三个值 分别为 1.机型最终附给html的font-size大小 2.我想赋给html的font-size大小 3.二者的倍数 尝试找了多个问题机型，最终的比例都是1.25左右（1.24999），所以解决方案如下 //针对机型适配的代码就不贴了 网上随手一搜一堆 这里就针对特殊机型的处理展示一下var docEl = doc.documentElement, setFontSize = function() { var clientWidth = document.documentElement.clientWidth, timer; if(!clientWidth) return;　　　　　　 //原本对于html的字号设置 我这里用的是750的标准 ，640的也是同理 docEl.style.fontSize = 100 * (clientWidth / 750) + 'px';　　　　　　 if(window.getComputedStyle(document

首先设置meta属性，如下代码： < meta name = "viewport" content = "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" > 使用如下代码就能实现移动端的适配： html { font - size : - webkit - calc ( 13.33333333 vw ) ; font - size : calc ( 13.33333333 vw ) ; } 100vw相当于浏览器的window.innerWidth，是浏览器的内部宽度，注意， 滚动条宽度也计算在内 ！那么1vw就是表示1%的屏幕宽度。 其中的 13.33333333vw 是怎么来的呢？就是你的设计稿是750px，那么设计稿的1px就是0.133333333vw，那么100px就是13.33333333vw。也即是html的font-size设置为100px相当于1rem（设计稿为750px）。那么我们就可以很轻松的换算设计稿中的单位为rem了，比如一个元素宽度为150px，转换为rem就是1.5rem。其他尺寸设计稿的计算方式依次类推。 参考网易新闻移动端的写法： /** * view-port list: 320x480 320x568 320x570 360x592 360x598

壹 ❀ 引 早在大半年前，我在负责整理定义了前端组JavaScript开发规范与less、css样式开发规范。一直想将两个规范整理成文章，但在整理了JavaScript规范后，我花了较多的时间在学习JavaScript基础知识，所以对于样式规范一直处于放置状态。直到上周我收到了一条关于JavaScript规范的评论，提醒了我样式规范不能再拖了，那么在放假前花点时间整理一遍作为复习也算不错。 说在前面，本文虽然作为规范但对于less与css写法也给出了部分建议，所以在阅读本规范前建议读者先掌握less基本用法，而对于规范这里也只是给出建议，毕竟适合自己的才是最好的，本文开始。 贰 ❀ 命名规范 贰 ❀ 壹 class、id命名 JavaScript变量我们推荐使用小驼峰，但样式命名得做点改变，这里我们推荐使用 - 分隔符拼接。 /* good */ #foo-bar;.foo-bar /* bad */ #fooBar;.fooBar 贰 ❀ 贰 less变量命名 我们知道less提供了样式变量可供复用，对于多单词变量命名推荐采用 @ 开头并以 - 分隔符拼接的命名方式。 /* good */ @border-color:#fff; /* bad */ @borderColor: #fff; 贰 ❀ 叁 less函数命名 除了变量，less还提供了函数用于复用多属性class样式类

今天在github上查找了安卓做一个记账本的相关项目。发现做一个安卓记账本实在超出了我的能力范围。于是决定把安卓先放一放，拾起我上学期的java web。 初步计划，写一个完整的记账本后提交到服务器上，通过web进行访问。也正好借此机会训练一下自己的java web能力。 首先，既然这个web要放服务器，前端界面就不能太难看。在上学期的学习中，重点掌握了后端的增删改查，前端的各种花里胡哨的东西都还没搞过。而且html css div的学习也并不系统，很多内容都是不清不楚。在这样的情况下，我决定先重新学习前端三大宝。今天看了一天的视频，跟着视频内容实现了用table实现一个商城首页： 这个界面有很长很长的页面，下面附上代码： 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>商城首页</title> 6 </head> 7 <body> 8 <!-- 1.创建一个八行一列的表格--> 9 <table border="1px" width="1300px" align="center" cellspacing="0px"> 10 <!-- 2.logo部分 --> 11 <tr> 12 <td> 13 <!-- 嵌套一个一行三列的表格 --> 14 <table border="1px"

转自： http://www.cnblogs.com/consta... 前言 随着移动设备的普及，移动web在前端工程师们的工作中占有越来越重要的位置。移动设备更新速度频繁，手机厂商繁多，导致的问题是每一台机器的屏幕宽度和分辨率不一样。这给我们在编写前端界面时增加了困难，适配问题在当下显得越来越突出。记得刚刚开始开发移动端产品的时候向设计MM要了不同屏幕的设计图，结果可想而知。本篇文章分享了一些处理多屏幕自适应的经验，希望有益于各位。 特别说明：在开始这一切之前，请开发移动界面的工程师们在头部加上下面这条meta： <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> 简单事情简单做-宽度自适应 所谓宽度自适应严格来说是一种pc端的自适应布局方式在移动端的延伸。在处理pc端的前端界面时候需要用到全屏布局时采用的就是此种布局方式。它的实现方式也比较简单，将外层容器元素按照百分比铺满的方式，里面的子元素固定或者左右浮动。 .div { width:100%; height:100px; } .child { float: left; } .child { float:right; } 由于父级元素采用百分比的布局方式

1.做搜索框： <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>小米闪购 - 小米商城</title> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"> <!--把图片放到cc文件夹下，直接引入图片--> <link rel="stylesheet" href="css/style.css"> <!--引入CSS的样式--> </head> <body> <div class="topbar"> <div class="container"> <div class="topbar-nav"> <a href="">小米商城</a><span>|</span> <!--spen标签 "|"给加回来--> <a href="">MIUI</a><span>|</span> <a href="">IOT</a><span>|</span> <a href="">云服务<