Jorux Notebook

Just a web designer's blog

时隔12年,Survival confirmation

12年,刚好一个干支轮回。 虽已不再从事web design相关工作,但是最近开始开发一款医疗相关APP,再次与web design发生交集。 本网站由于长期未能更新,主题仍然停留在wordpress2.0阶段,虽靠残存的记忆重写了部分css,仍然不能完美的继承原设计,甚是遗憾。 记录开发过程遇到的问题和解决思路。也算是一种纪念吧。 1.MySQL数据库迁移造成的乱码处理方法。 由于不良空间服务商擅自更新后台版本,造成MySQL数据文件被latin1编码改写,诸如此类方法,是无效的。 颇费周折之后找到以下方法,希望能帮到需要的人。 由于原始数据并没有变化,需要通过Mysql命令行将已经乱码的数据转写为Blob(二进制数据): ALTER TABLE `tableNAME` CHANGE `columnNAME` `columnNAME` blob 然后再转写为utf8格式: ALTER TABLE `tableNAME` CHANGE `columnNAME` `columnNAME` VARCHAR(2000) CHARACTER SET utf8 转换完成后可以在phpMyAdmin中将默认的排序规则“latin1_swedish_ci”更改为“utf8_general_ci” 或者参考先前的链接在命令行中执行。 2.Nginx反向代理wordpress时遇到的问题 服务器迁至AWS后,涉及到单一主机ip部署多个应用问题。 方法参考了这篇(单IP多站点反向代理配置)的部署方法。 部署nodejs应用和thinkphp应用都没有问题。但是在代理第三个wordpress网站时出现了主页无法显示的BUG。 参考了以下两篇文章: https://blog.csdn.net/wshk918/article/details/108047551 https://www.taijicoder.com/2018/04/21/deploy-wordpress-behind-reverse-proxy/ 问题出在wordpress没有原生支持反向代理. 需要在wp-config.php中加入 if ( ! empty( $_SERVER[‘HTTP_X_FORWARDED_HOST’] ) ) { $_SERVER[‘HTTP_HOST’] = $_SERVER[‘HTTP_X_FORWARDED_HOST’]; } Nginx Reverse Proxy 配置加入,并重启服务 […]

什么是Semantics?

Semantics可翻译为语义的(学),它是Html/Xhtml是否真正符合标准的重要一环。Jorux在这和大家讨论一些自己的观点,如有不妥之处,还请各位网友指正。在西方,为什么这么多人如此重视网页的Semantics,也许你会说,西方比较守规矩,重视标准,但我想说的是,在这些表象的背后有着“一只无形的手”控制着。

在此,举个导航条的例子来说明我的观点。

引号是可以成对的

引号(quote mark)顾名思义是用于引起人注意, 区别于一般内容之用的标点符号。分为上引号和下引号,并且是成对出现的,这种概念我们可能在小学就知道了,所以引号应该是成对出现的。
但是在现在网页设计中,由于某些原因,我们经常忽略这种基本概念,一些权威网站在使用引号时往往只使用上引号图标,导致大家觉得在技术上很难实现引号图标的成对。

布局篇(2)—If you love css …

上篇讲的布局(切割)方法相信大家己经掌握,其特点是用固定宽度(fixed-width)来实现页面内各个元素的显示效果,简单实用,易于掌握。本篇将讲述其他相对高级的布局方法。
布局的分类,根据对元素宽度的定义不同,布局可分为以下几种:

布局篇(1)—If you love css …

从本篇开始讲述如何用css实现网页的布局,即如何用css控制网页内各个元素的显示位置。
如果你是一个初学者,很可能觉得做一个网页的第一步就是布局。其实不然,css网页的设计过程可以参考分为以下几步:

属性篇(4)—If you love css …

本文作为属性篇的最后一篇文章, 将讲述HTML和CSS的关键—盒子模型(Box model). 理解Box model的关键便是margin和padding属性, 而正确理解这两个属性也是学习用css布局的关键.

: 为什么不翻译margin和padding? 原因一, 在汉语中并没有与之相对应的词语; 原因二: 即使有这样的词语, 由于在编写css代码时, 必须使用margin和padding, 如果我们总用汉语词语代替其来解释的话, 到了实际应用时容易混淆margin和padding的概念.

属性篇(3)—If you love css …

本篇主要介绍css对边框(border)的属性控制和链接(link)的伪类选择器.
边框(border): css控制的边框属性包括border-width, border-color, border-style.
Border之所以让人很困惑主要源于IE5错综复杂的BUG, 由于IE5是一个”will soon be dead“ 的浏览器, 这里只例举一个最为知名的关于border-width的BUG, 让大家更好的理解border的含义, 先看下图:

属性篇(2)—If you love css …

上次主要说明了css对于颜色和文本属性的控制, 这次介绍css对于字体, 背景等属性的控制.
字体(Font):css控制的字体属性包括font-family, font-style, font-variant, font-weight, font-size.
1.font-family: 由字体名(family-names)和字组名(generic families)两个部分组成.首先来看个实例,例:查看Jorux.com首页的css文件,可以看到以下代码:

属性篇(1)—If you love css …

本教程主要介绍css的基础知识,将逐个讲解css的各个属性,过程可能比较枯燥,但会尽力多举例说明.
css语法:例:用Web Developer的css查看功能查看Jorux.com首页的css文件,可以看到以下代码:
body {
font: normal 12px/1.5 Georgia, sans-serif;
text-align:left;
background:#444 url(images/bodybg.jpg) repeat-y;
}
是不是有点复杂,现在我们没有必要细究以上代码,先简化以上代码为:
body {text-align:left;}
这便是基本css语法结构:

If you love css …

我想把本篇作为css基础教程的序曲,从今天开始翻译和整理我从设计网页以来所学到的css基础知识。本教程会分成N个部分,单独发表,其间可能会插入几篇与教程无关的文章。没有具体的教程发表进度,推荐关注本教程的朋友订阅本站Feed。教程内容的 30%-50%为Jorux原创,其余翻译部分均为意译,可能来源于多个国外站点,并在教程结束时公布参考原文地址。
曾翻译过一篇css教程:十步学会用css建站,文章声称能在十步学会建站,虽说夸张点,但确实能学到一些东西,就像现代社会流行速成一样,它只是一个css快餐,要达到自由运用css,没个百八十步恐怕有点悬。

Designed by Jorux. Proudly powered by WordPress    Except where otherwise noted, this site is licensed under a Creative Commons License.