|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
掌握静态网页的制作技术是学习开发网站的先决条件,这一点就讲到这里,因为这篇文章不是教程文章,也就不对技术进行深入的刨析了。 在设计网站的时分,要切记一点:并非一切的会见者都是精神奕奕的年老人,并且他们也纷歧定完整熟习Web阅读器的各类利用办法。伶俐的设计者懂得这一点,他们经常将各类特别的可会见特征融入网站的设计中,如许,即便是年长者或是残疾人士都可以便利温馨地利用网站,而不用消费额定的力量。
文本巨细调理器是最无效的可会见特征中的一个,任何网站都能够需求它,简而言之,这是一个用于改动网页文字巨细的东西,凡是用于将文本变大从而易于浏览,良多阅读器已自带了这一特征,然而收集阅读器的初学者其实不晓得若何利用这一功效,因而,网站的设计者常常将更容易于利用的按钮放在每一个网页下去完成这一功效。
这篇指南将向您引见若何利用PHP和CSS在网页上添加具有这类功效的文本巨细调理器,因而,从速向您的网站添加这一可会见性,如许从年事大于50岁的用户那边取得赞誉的积分,持续向下读,您将学会利用它的办法。
注重:这篇指南假定您已装置了Apache和PHP
它是若何任务的?
在写代码之前,花一些工夫来了解文本巨细调理器的任务体例长短常无益的。网站中的每一个网页都包括一系列掌握按钮,他们答应用户选择页面的文字巨细:小号、中号和大号,每种字号都对应于一种CSS款式表,这些款式表保留了用于衬着网页文本巨细的划定规矩。
当用户做出选择的时分,PHP将用户选定的字号存储在一个会话变量中,然后从头加载网页,该页面将从会话变量中读取选定的字号,并静态挪用响应的款式表以更小的字号或更大的字号来从头衬着网页。
进程
第一步:创立网页
从创立HTML文档入手下手,起首完成占位符的内容,列表A是一个例子:
列表A:
Text size: small | href="resize.php?s=medium">medium | large
Loremipsum dolor sit amet,
consecteturadipisicingelit, sed do eiusmodtemporincididuntutlabore et dolore
magna aliqua. Utenim
ad minim veniam, quisnostrud exercitation ullamcolaboris nisi utaliquip ex ea
commodoconsequat.
Duisauteirure dolor in reprehenderit in
voluptatevelitessecillumdoloreeufugiatnullapariatur.
Excepteursintoccaecatcupidatat non proident, sunt in culpa qui
officiadeseruntmollitanim id estlaborum.
对页面顶部的文字超链接要出格注重,每一个超链接都指向了名为resize.php的剧本文件,并经由过程URL GET办法将选定的字体巨细传递给它。
在您的Web办事器目次中以.php的扩大名来保留这个文档,例如,index.php。
第二步:创立款式表
接上去,为每种文字巨细创立款式表文件:small.css, medium.css和large.css,这是small.css的文件内容:
body {
font: 10px
}
一样,可以创立medium.css和large.css,分离利用17px和25px,将这些款式表文件和上一步创立的网页保留在统一个目次中。
第三步:创立文本巨细的改动机制
正如上文引见的,网页经由过程查找事后界说的会话变量可以"晓得"加载哪一个款式表文件,会话变量是经由过程剧本文件resize.php来掌握的(拜见列表B),该文件是在用户点击了网页顶部改动文字巨细的按钮时激活的,这是resize.php的内容:
列表B
// start session
// import selected size into session
session_start();
$_SESSION['textsize'] = $_GET['s'];
header("Location: " . $_SERVER['HTTP_REFERER']);
?>
这很复杂,当用户选择了一种新的文本巨细,resize.php经由过程GET办法来取得字号的值,并将其存储在会话变量$_SESSION['textsize']中,然后将阅读重视新定向到本来翻开的哪一个页面。
固然,这里还短少一个组件:智能化得让网页主动检测如今用户如今选定的文本巨细并加载响应的款式表,为到场这一功效,翻开您的网页文件index.php,并将以下语句到场到文件的开首(拜见列表C):
列表C
// start session
// import variables
session_start();
// set default text size for this page
if (!isset($_SESSION['textsize'])) {
$_SESSION['textsize'] = 'medium';
}
?>
You should also add a stylesheet link between the ... elements, as follows:
type="text/css">
这是列表D,完全的index.php文件应当是如许的:
列表D:
// start session
// import variables
session_start();
// set default text size for this page
if (!isset($_SESSION['textsize'])) {
$_SESSION['textsize'] = 'medium';
}
?>
type="text/css">
Text size: small | href="resize.php?s=medium">medium | large
Loremipsum dolor sit amet,
consecteturadipisicingelit, sed do eiusmodtemporincididuntutlabore et dolore
magna aliqua. Utenim
ad minim veniam, quisnostrud exercitation ullamcolaboris nisi utaliquip ex ea
commodoconsequat.
Duisauteirure dolor in reprehenderit in
voluptatevelitessecillumdoloreeufugiatnullapariatur.
Excepteursintoccaecatcupidatat non proident, sunt in culpa qui
officiadeseruntmollitanim id estlaborum.
了解这类任务体例应当很复杂了,当载入网页的时分,它恢复以后的会话,并反省$_SESSION['textsize']变量是不是与领先选择的字号符合,然后经由过程元素静态加载响应的款式表,这将招致网页以准确的巨细主动从头衬着。
结合利用PHP和CSS与传统的体例略有分歧,传统体例是利用JavaScript来静态改动CSS款式表,相对JavaScript办法,PHP办法的优势在于您不需求依附客户端对JavaScript的撑持,您也不需忧虑专门创立针对某个阅读器的任务,或许下一次您坐上去设计网站的时分会发明这类办法很无效,祝编程兴奋!
会HTML吗?会,我能编好几个大表格排板的网页啦! |
|