版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
使用CSS设置基本的选择符有哪三种?优先级如何?更多类型的选择符有哪些?常用的CSS数据单位有哪些?样式表有几种导入方式?它们的区别及优先级如何?会使用CSS文字样式文字实例:模拟Google公司的logo会使用CSS段落文字段落实例:百度搜索本讲目标导入文字是网页设计中必不可缺的元素,使用过word的用户会发现,word可以对文字的字体、大小、颜色等属性进行设置,CSS同样可以做到。我们将从以下几个方面进行学习:
a、字体
b、文字大小
c、文字颜色d、文字粗细e、斜体f、文字的下划线、g、英文字母大小写字体在HTML语言中,对文字字体的控制,是通过
在CSS中,则是通过font-family属性来控制的
<fontface=“黑体”>p{font-family:"黑体","宋体",Arial,sans-serif;}serif与sans-serif区分<pstyle="font-family:serif;">K</p><pstyle="font-family:sans-serif;">K</p>serif字体sans-serif字体我们发现:左侧的K较之右侧的K,在字笔画开始及结束的地方有额外的修饰,易读性更强,长时间阅读这样的字体不容易疲劳
左侧字体常用于正文,右侧字体常用于标题文字大小CSS对于文字大小控制是通过该属性的值可以是相对大小也可以是绝对大小,在这里提供了三种常用的数据单位:h1{font-size:12px;}单位描述示例px像素(pixel)width:12px;em相对于当前对象内文本的字体尺寸font-size:1.5em;Pt点/磅(point)font-size:9pt;文字颜色文字各种颜色的合理搭配,使得页面五彩缤纷,在CSS中文字颜色的控制是通过color属性的值有两种常用的表达方式:h1{color:#000000;}#RRGGBB十六进制颜色单位color:#FF0000;ColorName浏览器所支持的颜色名称color:red;注意:在设置某一个段落文字的颜色时,可以利用<span>标记,将需要的部分进行单独标注。文字粗细在HTML语言中可以通过<b>标记或者<strong>标记将文字设置成粗体。在CSS中,提供了更为细致的划分font-weight:100;font-weight:200;font-weight:300;……….font-weight:900;font-weight:bold;font-weight:normal;文字下划线、顶划线和删除线提起文字下划线,我们会联想到超链接无下划线特效。
通过演示,我们来了解该属性具体的值的效果a:hover{text-decoration:underline;}英文字母大小写英文字母大小写转换是CSS提供的很实用的功能之一p{ text-transform:capitalize;/*单词首字大写*/ text-transform:lowercase;/*全部小写*/ text-transform:uppercase;/*全部大写*/}通过演示,我们来了解该属性具体的值的效果。文字实例一:模拟Google公司Logo要求做出如下图片所示效果:提示:1、整体上控制字体大小、字体间距以及字体类型
2、采用<span>标签分割每一个字符,单独添加样式
3、颜色的采集通过TakeColor软件进行截取案例演示Google网页演示文字实例二:制作页面的五彩标题要求对“SuperTitleCSS”该标题进行样式指派,依次实现下列图片实现效果:
练习页面效果页面效果一:效果二:效果三:效果四:CSS段落文字对齐方式水平对齐通过属性text-align
来控制垂直对齐通过属性vertical-align来控制行间距和字间距行间距通过属性line-height
来控制字间距通过属性letter-spacing来控制首字放大在许多报刊或杂志的文章中,开篇第一个字很大,借此第一时间来吸引住顾客的眼球。问题:首字放大,有几种实现方式?如果想给段落的第一行设置下划线效果又
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 2026湖南株洲市教育局直属学校面向高校毕业生招聘教师5人考试备考题库及答案解析
- 2026年小学大队委和值日生竞选方案
- 2025重庆农投肉食品有限公司招聘13人备考笔试试题及答案解析
- 深度解析(2026)《GBT 25915.8-2021洁净室及相关受控环境 第8部分:按化学物浓度划分空气洁净度(ACC)等级》
- 2026年河北张家口经开区编办青年就业见习岗位招聘备考考试试题及答案解析
- 深度解析(2026)《GBT 25714.1-2010铁液浇包 第1部分:型式与基本参数》(2026年)深度解析
- 深度解析(2026)GBT 25668.1-2010镗铣类模块式工具系统 第1部分:型号表示规则
- 2025-2026广东佛山里水中学教师招聘参考笔试题库附答案解析
- 2026广东佛山大学诚聘海内外高层次人才招聘参考笔试题库附答案解析
- 2025辽宁建筑职业学院赴高校现场招聘10人参考考试试题及答案解析
- 2025年学法普法考试答案(全套)
- 河北省部分地区2023-2024学年度高二上学期期末考试英语试题(解析版)
- 医学装备管理与使用理论考核试题及答案
- 医院产科培训课件:《妊娠期宫颈疾病的诊治策略》
- 水质监测服务投标方案(技术标)
- 国家集采中选目录1-8批(完整版)
- 【员工关系管理研究国内外文献综述2800字】
- 《三只小猪盖房子》拼音版故事
- YS/T 921-2013冰铜
- GB/T 6072.1-2008往复式内燃机性能第1部分:功率、燃料消耗和机油消耗的标定及试验方法通用发动机的附加要求
- GB/T 3883.201-2017手持式、可移式电动工具和园林工具的安全第2部分:电钻和冲击电钻的专用要求
评论
0/150
提交评论