HTML网页代码中如何设置文字水平垂直居中的代码？1如图，我们创建一个盒子，然后中间输入文字信息2当我们对盒子添加了边框颜色后，浏览器效果如图所示，文字在左侧第一行位置3想要文字居中，可以输入text
HTML网页代码中如何设置文字水平垂直居中的代码？
1如图，我们创建一个盒子，然后中间输入文字信息2当我们对盒子添加了边框颜（读：yán）色后【hòu】，浏览器效果如图所示，文字在左侧第一行位置
3想要文字居中，可以输入text-align 这个文字的对齐样式了，然后在属性中输入center中间的意思，就是将文字在水平位置居中
4如图，这[繁体：這]样就是文字在水平位置上的居中了
5还有就是设置文字的垂直居中对齐了，可[kě]以根据不同的需要调整margin或者line值，这里使用的是{pinyin：shì}行高将其设置为垂直居中，如图，行高的属性是line-height，后面的属性值设置和父级的盒状标签高度相同，这样就可以做到文字垂直方向上居中了
6如图，最后的效果{练：guǒ}就是这样的了。
怎样在网页中做出精彩的文字排版？
所以这里技巧吧！1.不要使用过[guò]多的字体
网站排版中建议最多不要超过3种字体类型，不《拼音：bù》然会使网站看起【练：qǐ】来松散和不专业，不{bù}仅太多的字体类型会造成这种问题，太多的字体尺寸也会破坏网页布局。
通常情况下，将字体类型的数量限制在最小数量（2个是很多，1个通常就够了），整个网站坚持使用相同的原则。如果使用多个字体，请确保俩个字体是{pinyin：shì}和谐的。以下（拼音：xià）面的字体组合为例，Georgia和Verdana的搭配相得益彰，相对比较和谐。相比于右边Baskerville和Impact则会有明显的冲突感，非衬线Impact明显的超chāo 过了Baskerville的视觉冲击力
而在中英文排版中，建议大家中文使用标准中文字体，而英文、数字和字（zì）符使用标准的英文字体。以下图为例，可做对比参考。 左：中文（汉仪旗黑） 英文（DIN Next LT Pro#29 标点符号使用半角字符 右：中文（汉[繁体：漢]仪旗黑） 英文（汉仪旗黑） 标点符号使用全角字符。
2.尽量{pinyin：liàng}使用标准字体
在Google Web Font或者Typekit，和国内的“有字库”的字体嵌入式服务有很多有趣的【练：de】字体，对于（繁体：於）国内设计师来说，痛苦的是中文字体会很大，一个字体动则几兆，十几兆的，这样用户在会增加用户浏览网站的载入时间；反之英文字体26个字母大小写，加数字标点符号一共几（繁体：幾）百k的字体是很容易在网页中使用的。
尽可能选择标准字体（近几【pinyin：jǐ】年网页中通常使用思源黑体，PingFang，英文可以使用Arial，Calibri或者其他常见的易于屏幕阅读的黑体字，如《练：rú》没有特殊概念指导尽可能避免使用衬线字体，如宋体） 不是每位用户都可以在终端上（练：shàng）看到同一个字体，意味着你选择的适合的字体，用户有可能看不到。 用户更熟悉标准字体[繁：體]，因此他们可以更快的阅读 特殊的、并且少量的字体可以制作成.svg格式的素材嵌入Web使用 良好的排版会使用户更加关注内容本身，而不是字体的类型。
3.限制一行文字《拼音：zì》的长度
保证每一行文字的字符数量是文本可读的关键。不仅由设计师来定义文本的宽度，同时需要根据用户的可读性来定义。 太宽-会使得单行文字太长[繁：長]，读者的眼睛会难于专注文字。因为长时间阅读容易串行(pinyin：xíng)，大段的文本中很难找到正确的行
太短-会使得用户的眼睛经常回到下一行文本，会打破读者的阅读节奏，长时间阅读造成视觉疲劳。太短也会倾向于向读者发出一种信{练：xìn}号，使得读者没有读完当前这行就去跳到下(xià)一行阅读，可能会忽略潜在的重要词句。
对于移动设备，应该每行30-40个字符（半角），具体显示多少个字数，与不同分辨[拼音：biàn]率开云体育的屏幕、文本宽度和字体大小都会有关系，设计的原则是：保证用户可以流畅的阅读文本，文字不宜太小或太大。以iOS（手机）为例，正文文本最小字号不能小于24px，太小了用户阅读会难以阅读。以百度为例，可作为参考。
4.选择用（拼音：yòng）有多个字重，屏幕显示良好的字体
用户将通过不同屏幕分辨率的终（繁体：終）端设备访问你的网站，大多数用户界面需要各种大小尺寸的文本（标(繁体：標)题（读：tí）、副标题、文本、标注等等）。选择一款能够在不同屏幕分辨率的设备上运行良好的字体以保证它的不同尺寸的字体都具有极高可读性#28Readability#29和可用性#28Usability#29也是非常重要的。
近俩年备受大家欢迎的思源黑体和PingFang字体都是不错的选择，当然，个人认为汉仪旗黑无论从家族澳门威尼斯人字体的数量、字体质量、屏幕显示、纸媒印刷上来说都不逊色于前面俩款字体。参与过思源黑体设计的设计师曾说过，思源黑体还是相对比较粗糙的一款字体。 同样，为了保证在屏幕上清晰可辨，尽(繁：盡)量避免使用衬线体，尽管他们很漂亮。
5.使用识别度高的字体《繁体：體》
在选择英文体的时候，有些字体澳门巴黎人的个别字母极易混淆，特别是“i”和“L”（如下图所示）；以及文字之《拼音：zhī》间的间距。许多中文字体在使用较小字体的时候笔画会粘到一起#28上图），不容易辨别；所以在选择字体类型的时候，请检查你选择使用的字体，确保不会为用户和产品造成不必要的损失。
6.避免在幸运飞艇界面中大{练：dà}段的使用大写字母
不要所有文本使用大写字母，强制用户阅读大写字母，首字母大写，具有特殊含义的缩写等情况（繁体：況）除外，与小写字（pinyin：zì）母相比，大量的使用大写字母会严重降低用户的《拼音：de》阅读效率和愉悦感。
7.将行间距控制在字体的1.5-2.0倍之间(繁：間)
在（拼音：zài）文字文字排版中，我们又一个特殊shū 的术语，用于表{pinyin：biǎo}示行与行之间的距离：行间距（或行高）。为了保证文本的可读性和易读性，使文本形成线性的阅读感受，在网页设计中，通常情况下将行间距控制在字体大小的1.5-2.0倍之间（中文字体）。英文字体推荐使用默认行间距，或根据默认行间距微调。
8.适[繁体：適]当的颜色对比度 通常情况下，文（pinyin：wén）本和背景尽量避免【读：miǎn】使用相同或相似的颜色。
文本越明显，用户能够扫描和阅读的速度越快。当然，学会通过文本颜色、大小和背景的颜色关系来控制视觉层级也是必要的。 与背景相比，小文本和背景的de 对比度至少为4.5:1 大文本（14px/18px以上）应[繁：應]该保持与背景3:1以上的对比度
灰色通常作为辅助色使用，根据我自己的项目经【繁：經】验，给大家分亚博体育享一套我自己一直在使用的灰色，灰的有层次，清晰的区分信息层级是必要的。
9.避免将文字着色为《繁体：爲》红色或绿色
色盲和色弱是《读：shì》我必须要照顾到(pinyin：dào)的一部分用户，特别是在男性《拼音：xìng》中（8％的男性是色盲）建议使用处颜色以外的其他方式来区分重要的信息（如下划线，加粗等）。避免使用红色和绿色单独传达信息。因为红绿色盲是最常见的色盲形式。（现在想想，那些因为红绿色盲而考不了驾照的童鞋是{pinyin：shì}不是要分分钟恨死制定红绿灯规则的人，当然这只是个笑话，使用红绿灯是因为光学在物理传播方面的原因，这里不解释）
虽然在[练：zài]日常生活中我们总是用这种方式告知用户绿色是表示正确的操作，红色表示错误的操作，反思一下我们是否有去考虑色盲用户的操作和体验。或许我们是不是可以考虑换一个【gè】方式去表达正确或错误？
10.避（pinyin：bì）免文字闪烁
闪烁的文【拼音：wén】字或内容可能会（繁：會）让某些用户感到不适，对于一般用户而言，这可能分散他们的注意力或者使他(pinyin：tā)们感到烦躁。
虽然在网页设计中依然有很多需要我们注意的地方，最后，分享给大家一个想法就【jiù】是：网页设计中排版很重要。做出正确的排版可(pinyin：kě)以让你的网站感觉清爽，糟糕的网【繁体：網】页排版会令用户分心，倾向于关注自己的感受而非内容。排版的关键在于使信息层级清晰、用户易于阅读、并且保证文字是可读的。文字的排版不应该增加用户的认知[练：zhī]符合，以求达到尊重内容、尊重用户的目的。
本文链接：http://21taiyang.com/Business-Operations/4830892.html
网页设计字体上下居中 HTML网页代码中如何设[繁：設]置文字水平垂直居中的代码？转载请注明出处来源
