1. 缩进
text-indent 属性,所有元素的第一行都可以缩进一个给定的长度,甚至该长度可以是负值
属性值有三种:
length 定义固定的缩进。默认值:0
% 定义基于父元素宽度的百分比的缩进
inherit 规定应该从父元素继承 text-indent 属性的值
【注意:1.任何版本均IE不支持属性值inherit(继承);2.不支持行内元素】
2. 水平对齐
left | 把文本排列到左边。默认值:由浏览器决定。 |
right | 把文本排列到右边。 |
center | 把文本排列到中间。 |
justify | 实现两端对齐文本效果。 |
inherit | 规定应该从父元素继承 text-align 属性的值。 |
text-algin:justify在两端对齐文本中,文本行的左右两端都放在父元素的内边界上。然后,调整单词和字母间的间隔,使各行的长度恰好相等。两端对齐文本在打印领域很常见
具体使用场景及注意事项我在后面文章http://570109268.iteye.com/blog/2409915里做了总结
3 . 字间隔
word-spacing 属性可以改变字(单词)之间的标准间隔,其默认值 normal 与设置值为 0 是一样的。
接受一个正长度值或负长度值:如果提供一个正长度值,字间隔增加;为 word-spacing 设置负值,会拉近
4 . 字母间隔
letter-spacing 属性的可取值包括所有长度,默认关键字是 normal(这与 letter-spacing:0 相同)。输入的长度值会使字母之间的间隔增加或减少指定的量
letter-spacing 与 word-spacing 的【区别】:字母间隔修改的是字符或字母之间的间隔
【适用场景】
段落汉字间距与英文字母用letter-spacing属性,英文段落单词间距用word-spacing属性
5 . 字符转换
text-transform 属性处理文本的大小写,这个属性有 4 个值:
none(不修改),uppercase(大写),lowercase(小写),capitalize(首字母答案写)
<style type="text/css"> p.uppercase {text-transform: uppercase} p.lowercase {text-transform: lowercase} p.capitalize {text-transform: capitalize} </style> <p class="uppercase">This is some text in a paragraph.</p> <p class="lowercase">This is some text in a paragraph.</p> <p class="capitalize">This is some text in a paragraph.</p>
【好处】
① 只需写一个简单的规则来完成这个修改,而无需修改 h1 元素本身;
② 如果以后决定将所有大小写再切换为原来的大小写,可以更容易地完成修改
6 . 文本装饰(下划线,上划线,贯穿线)
text-decoration 有 5 个值:
none(无行为),underline(下划线),overline(上划线),line-through(贯穿线),blink(闪烁)
【效果】
①underline 会对元素加下划线,就像 HTML 中的 U 元素一样;
②overline 的作用恰好相反,会在文本的顶端画一个上划线;
③值 line-through 则在文本中间画一个贯穿线,等价于 HTML 中的 S 和 strike 元素
④blink 会让文本闪烁,类似于 Netscape 支持的颇招非议的 blink 标记
7 . 处理空白符(换行/不换行)
white-space 属性会影响到用户代理对源文档中的空格、换行和 tab 字符的处理
通过使用该属性,可以影响浏览器处理字之间和文本行之间的空白符的方式
normal | 默认。空白会被浏览器忽略。 |
pre | 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。 |
nowrap | 文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。 |
pre-wrap | 保留空白符序列,但是正常地进行换行。 |
pre-line | 合并空白符序列,但是保留换行符。 |
inherit | 规定应该从父元素继承 white-space 属性的值。 |
8 . 文本方向
如果是英文书籍,就会从左到右、从上到下地阅读,这就是英文的流方向。不过,并不是所有语言都如此。古汉语就是从右到左来阅读,当然还包括希伯来语和阿拉伯语等。CSS2 引入了一个属性来描述其方向性
direction 属性:
影响块级元素中文本的书写方向、表中列布局的方向、内容水平填充其元素框的方向、以及两端对齐元素中最后一行的位置
【注释:】
对于行内元素,只有当 unicode-bidi 属性设置为 embed 或 bidi-override 时才会应用 direction 属性
direction 属性有两个值:ltr 和 rtl。大多数情况下,默认值是 ltr,显示从左到右的文本。如果显示从右到左的文本,应使用值 rtl
9 . 字体
① 字体系列/声明
font-family 规定元素的字体系列,可以把多个字体名称作为一个“回退”系统来保存。如果浏览器不支持第一个字体,则会尝试下一个。也就是说,font-family 属性的值是用于某个元素的字体族名称或/及类族名称的一个优先表,浏览器会使用它可识别的第一个值
【2种字体系列】
指定的系列名称:具体字体的名称,比如:"times"、"courier"、"arial(宋体)"
通常字体系列名称:比如:"serif"、"sans-serif"、"cursive"、"fantasy"、"monospace"
注意:使用某种特定的字体系列(Geneva)完全取决于用户机器上该字体系列是否可用;这个属性没有指示任何字体下载。因此,强烈推荐使用一个通用字体系列名作为后路
【字体名带单引号】
只有当字体名中有一个或多个空格(比如 New York),或者如果字体名包括 # 或 $ 之类的符号,才需要在 font-family 声明中加引号
单引号或双引号都可以接受。但是,如果把一个 font-family 属性放在 HTML 的 style 属性中,则需要使用该属性本身未使用的那种引号:
<p style="font-family: Times, TimesNR, 'New Century Schoolbook', Georgia, 'New York', serif;">字体声明加引号</p>
②字体倾斜
font-style 属性最常用于规定斜体文本,该属性有三个值:normal(正常),italic(斜体),oblique (斜体)
【italic 和 oblique 的区别】:web浏览器表现无异
③字体变形(小型大写字母)
font-variant 属性设置小型大写字母的字体显示文本,所有的小写字母均会被转换为大写,但是所有使用小型大写字体的字母与其余文本相比,其字体尺寸更小
font-variant(字体变形)属性值:normal默认值;small-caps小型大写字母
④字体粗细
font-weight 属性设置文本的粗细
normal | 默认值。定义标准的字符。 |
bold | 定义粗体字符。 |
bolder | 定义更粗的字符。 |
lighter | 定义更细的字符。 |
|
定义由粗到细的字符。400 等同于 normal,而 700 等同于 bold。 |
inherit | 规定应该从父元素继承字体的粗细。 |
⑤ 字体大小
font-size 值可以是绝对或相对值
【绝对值】
将文本设置为指定的大小;不允许用户在所有浏览器中改变文本大小(不利于可用性);绝对大小在确定了输出的物理尺寸时很有用
【相对值】
相对于周围的元素来设置大小;允许用户在浏览器改变文本大小
【注意】如果您没有规定字体大小,普通文本(比如段落)的默认大小是 16 像素 (16px=1em)
接下来对比下px(pixels像素)与em:
①px:
通过像素px设置文本大小,可以对文本大小进行完全控制;
②em:
通过em设置文本大小,1em 等于当前的字体尺寸。如果一个元素的 font-size 为 16 像素,那么对于该元素,1em 就等于 16 像素。在设置字体大小时,em 的值会相对于父元素的字体大小改变
浏览器中默认的文本大小是 16 像素。因此 1em 的默认尺寸是 16 像素
可以使用下面这个公式将像素转换为 em:pixels/16=em
(注:16 等于父元素的默认字体大小,假设父元素的 font-size 为 20px,那么公式需改为:pixels/20=em)
h1 {font-size:3.75em;} /* 60px/16=3.75em */ h2 {font-size:2.5em;} /* 40px/16=2.5em */ p {font-size:0.875em;} /* 14px/16=0.875em */ <h1>This is heading 1</h1> <h2>This is heading 2</h2> <p>This is a paragraph.</p> <p>This is a paragraph.</p>
【em优点】
使用 em 单位,可以在所有浏览器中调整文本大小
【问题】
不幸的是,在 IE 中仍存在问题;在重设文本大小时,会比正常的尺寸更大或更小
【方案】
结合使用百分比和 EM
在所有浏览器中均有效的方案是为 body 元素(父元素)以百分比设置默认的 font-size 值:
body {font-size:100%;} h1 {font-size:3.75em;} h2 {font-size:2.5em;} p {font-size:0.875em;}
这样在所有浏览器中,可以显示相同的文本大小,并允许所有浏览器缩放文本的大小
相关推荐
1. **矢量绘图**:Fireworks 4提供了一套完整的矢量图形绘制工具,包括线条、形状、曲线、文本等,使设计师能够精确控制图形的每一个像素,创建出清晰、无损的图像。 2. **图层管理**:支持多图层编辑,可以方便地...
- **样式定制**:可以使用`cssStyle`属性来定制错误消息的显示样式,如`<s:actionerror cssStyle="color:red"/>`。 - **表单元素样式**:通过设置`theme`属性来改变表单元素的外观,如`...
./data/japanese-single-speaker-speech-dataset/transcript.txt应该是笔录数据的路径。 运行预处理, $ python -m voice100.preprocess --dataset css10ja 这将生成data/css10ja_train.npz和data/css10ja_val....
删除可能不敏感或不确定的语言(使用“单数”)[ ] 提供视频内容字幕和成绩单 提供音频内容的笔录 确保主体(段落)文本不小于默认(用户代理)大小[ ] 支持“捏缩放”(删除user-scalable=no如果存在)) 使用相对...
deepseek经验分享-陈雄.pptx
本家政服务平台就是在这样的大环境下诞生,其可以帮助管理者在短时间内处理完毕庞大的数据信息,使用这种软件工具可以帮助管理人员提高事务处理效率,达到事半功倍的效果。此家政服务平台利用当下成熟完善的Spring Boot框架,使用跨平台的可开发大型商业网站的Java语言,以及最受欢迎的RDBMS应用软件之一的MySQL数据库进行程序开发。家政服务平台有管理员,雇主,雇员三个角色。管理员功能有个人中心,雇主管理,雇员管理,资料认证管理,项目类型管理,服务项目管理,需求信息管理,服务预约管理,申请预约管理,签订合同管理,雇主评价管理,留言板管理,系统管理。雇主可以发布需求,雇员可以申请预约,雇主支付报酬,雇主和雇员可以签订合同,雇主可以对雇员进行评价。家政服务平台的开发根据操作人员需要设计的界面简洁美观,在功能模块布局上跟同类型网站保持一致,程序在实现基本要求功能时,也为数据信息面临的安全问题提供了一些实用的解决方案。可以说该程序在帮助管理者高效率地处理工作事务的同时,也实现了数据信息的整体化,规范化与自动化。 关键词:家政服务平台;Spring Boot框架;MySQL;自动化
SAP SD-Class 4 Item proposal & CMIR-Customer material info record.mp4
【毕业设计】“跑鸭”微信小程序-一款基于校园跑步的社交小程序(实时里程配速、运动路径、整公里提醒、周榜月榜、打卡分享、热门推荐、线上活动、勋章墙、隐私设置 【源码+论文+答辩ppt+开题报告+任务书】.zip【项目资源】:包含前端、后端、移动开发、操作系统、人工智能、物联网、信息化管理、数据库、硬件开发、大数据、课程资源、音视频、网站开发等各种技术项目的源码。包括STM32、ESP8266、PHP、QT、Linux、iOS、C++、Java、MATLAB、python、web、C#、EDA、proteus、RTOS等项目的源码。 【项目质量】:所有源码都经过严格测试,可以直接运行。功能在确认正常工作后才上传。 【适用人群】:适用于希望学习不同技术领域的小白或进阶学习者。可作为毕设项目、课程设计、大作业、工程实训或初期项目立项。 【附加价值】:项目具有较高的学习借鉴价值,也可直接拿来修改复刻。对于有一定基础或热衷于研究的人来说,可以在这些基础代码上进行修改和扩展,实现其他功能。 【沟通交流】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。鼓励下载和使用,并欢迎大家互相学习,共同进步。
大学生创业项目源码
使用requests和BeautifulSoup库爬取豆瓣电影Top250的基本信息
数据集文件包含美国各地电动汽车 (EV) 注册的详细记录,其结构便于分析并与数据处理工具集成。它通常以 CSV 格式提供,以确保与各种数据分析平台的兼容性。 关键列和数据属性: 做:电动汽车制造商(例如,特斯拉、日产、雪佛兰)。 型:车辆的特定型号(例如,Model S、Leaf、Bolt)。 车型年份:车辆模型的制造年份。 电动续航里程:每次充电的估计电动行驶里程(以英里为单位)。 EV 类型:将车辆分类为电池电动汽车 (BEV) 或插电式混合动力电动汽车 (PHEV)。 州和县:车辆注册的地理位置,允许进行区域分布分析。 注册人数:每个地区每个车型注册的车辆数量,有助于识别高浓度的 EV 区域。
施耐德ATV312变频器通过MCGS RTU通讯实现双机监控与控制的触摸屏集成解决方案,无PLC的施耐德ATV312变频器通讯示例:触摸屏控制监控两台变频器,功能多且省成本,改进型可调整步长 P&O MPPT(二区MPPT复现),光储系统MPPT 直流负载供电的单级离网光伏系统中,降压转器将太阳能光伏阵列和直流负载连接起来,同时确保最大功率点跟踪(MPPT) 和电池充电控制的良好运行。 在MPPT方面,提出了一种改进的自适应步长扰动观测(P&O)方法,以达到不同天气条件下太阳能光伏阵列的实际最大功率点(MPP),同时减少稳态振荡和功率损耗。 此外,电池充电控制侧使用三级充电控制器 (TSCC) 为铅酸电池站充电。 ,改进型P&O; 复现二区MPPT; 光储系统MPPT; 最大功率点跟踪(MPPT); 步长扰动观测; 降压转换器; 太阳能光伏阵列; 电池充电控制; 三级充电控制器(TSCC); 铅酸电池站。,改进型P&O MPPT技术,光储系统高效能量管理
基于stm32家庭安全防控系统 (程序+WiFi)
Maxwell电机与Simplorer联合仿真教程:矢量控制SVPWM算法与电路搭建详解,自定义电机模型替换指南,Maxwell电机与Simplorer联合仿真教程:电路搭建及矢量控制SVPWM算法实
CNN相关以及垃圾分类数据集
互联网发展至今,无论是其理论还是技术都已经成熟,而且它广泛参与在社会中的方方面面。它让信息都可以通过网络传播,搭配信息管理工具可以很好地为人们提供服务。针对信息管理混乱,出错率高,信息安全性差,劳动强度大,费时费力等问题,采用流浪动物救助网站可以有效管理,使信息管理能够更加科学和规范。 流浪动物救助网站在Eclipse环境中,使用Java语言进行编码,使用Mysql创建数据表保存本系统产生的数据。系统可以提供信息显示和相应服务,其管理员增删改查动物信息和动物信息资料,审核动物信息预订订单,查看订单评价和评分,通过留言功能回复用户提问。 总之,流浪动物救助网站集中管理信息,有着保密性强,效率高,存储空间大,成本低等诸多优点。它可以降低信息管理成本,实现信息管理计算机化。 关键词:流浪动物救助网站;Java语言;Mysql
对机动车号牌信息管理的提升,也为了对机动车号牌信息进行更好的维护,机动车号牌管理系统的出现就变得水到渠成不可缺少。通过对机动车号牌管理系统的开发,不仅仅可以学以致用,让学到的知识变成成果出现,也强化了知识记忆,扩大了知识储备,是提升自我的一种很好的方法。通过具体的开发,对整个软件开发的过程熟练掌握,不论是前期的设计,还是后续的编码测试,都有了很深刻的认知。 机动车号牌管理系统通过MySQL数据库与Spring Boot框架进行开发,机动车号牌管理系统能够实现牌照换补申请管理,用户管理,牌照申请管理,牌照转移申请管理,车辆信息管理,公告信息管理等功能。 通过机动车号牌管理系统对相关信息的处理,让信息处理变的更加的系统,更加的规范,这是一个必然的结果。已经处理好的信息,不管是用来查找,还是分析,在效率上都会成倍的提高,让计算机变得更加符合生产需要,变成人们不可缺少的一种信息处理工具,实现了绿色办公,节省社会资源,为环境保护也做了力所能及的贡献。 关键字:机动车号牌管理系统,牌照,车辆信息
Maxwell电机与Simplorer联合仿真教程:矢量控制SVPWM算法及电路搭建指南,包含详细视频与可复制电机模型替换示范,教程Simplorer与Maxwell电机联合仿真,详细教程包含电路
内容概要:本文档详细介绍了一个名为《Python实现基于IBES-ELM基于改进的秃鹰搜索优化算法优化极限学习机的数据回归预测》的项目。该项目旨在通过结合改进的秃鹰搜索优化算法(IBES-EO)和极限学习机(ELM),优化ELM模型以提高其预测精度,尤其针对多指标、高维数据以及噪声数据的处理进行了探讨。项目涵盖了从数据预处理到建模预测的一系列完整流程,并提供了代码案例和GUI界面设计思路。文档详细阐述了模型的工作机制、适用场景及其实现细节。 适合人群:对机器学习有兴趣,特别是对ELM、IBES-EO感兴趣的研究人员、开发人员和技术爱好者。 使用场景及目标:适用于各种回归预测问题,包括但不限于金融预测、气象预测、健康数据分析和智能交通系统等。目标在于提供一种高效的解决方案,提高在大规模复杂数据集中进行回归预测的能力,同时也展示了如何将生物启发式的优化算法运用于改进现有的机器学习模型,为实际应用提供更多可能。 阅读建议:文档按照章节顺序编排,从背景介绍到具体实现再到最终总结。初学者可以从头至尾通读,以掌握全流程概念和技能;有一定经验的读者可以直接跳转至自己感兴趣的环节,例如优化算法的具体设计或者代码实现部分。建议边学习边动手实验,以达到最佳的学习效果,并可通过提供的完整示例代码加深理解和记忆。此外,项目中有关于系统架构设计、API接口搭建等内容也可作为实际工程项目参考。
本案例使用鸢尾花萼长度(sepal length)、花萼宽度(sepal width)、花瓣长度(petal length)和花瓣宽度(petal width)作为特征,采用Adaboost算法将其进行分类。 同学们通过本案例学习Adaboost算法的理论基础以及在分类问题中的应用,同时通过实际操作加深对分类算法和数据分析的理解。更好的掌握机器学习算法,培养对数据科学的兴趣和实践能力。