font-size:设置字体大小:
该属性值的单位可以使用相对单位和绝对单位,推荐使用px。(浏览器能够识别的最小像素是12px)
p{
font-size:20px;
}
常见尺寸单位:
font-family:设置字体:
如果需要设置多个字体样式,则属性值可以写多个中间用逗号隔开即可,需要知道的是浏览器会从第一个字体属性值找,直到找到自己设备有的字体显示,自己设备没有的字体,按设备默认字体显示,推荐系统默认字体。
p{
font-family:"微软雅黑",Arial;
}
font-weight:设置字体粗细:
其属性值有:normal正常不加粗、bold加粗、bolder更粗、lighter更细、number(整百的数字)、inherit继承父级元素字体粗细
p {
font-weight:700;
}
font-style:设置字体风格:
如设置斜体、倾斜或正常字体,其属性值:normal默认值,标准字体、italic斜体、oblique倾斜
font:综合设置字体样式(字体样式连写):
字体样式连写是有顺序的,必须是严格遵循顺序,其中不需要设置的属性可以省略,font-size和font-family属性值必须写,否则字体连写失效。
p{
/*font:font-style font-weight font-size/line-height font-family;*/
font:italic bolder 20px/10px Arial;
}
提示:本文图片等素材来源于网络,若有侵权,请发邮件至邮箱:810665436@qq.com联系笔者 删除。
笔者:苦海123
其它问题可通过以下方式联系本人咨询:
QQ:810665436
微信:ConstancyMan
TML 文本格式化
加粗文本
斜体文本
电脑自动输出
这是 下标 和 上标
HTML 格式化标签
HTML 使用标签<b> 与<i> 对输出的文本进行格式, 如:粗体 or 斜体
这些HTML标签被称为格式化标签(请查看底部完整标签参考手册)。
通常标签 <strong> 替换加粗标签 <b> 来使用, <em> 替换 <i>标签使用。然而,这些标签的含义是不同的:<b> 与<i> 定义粗体或斜体文本。<strong> 或者 <em>意味着你要呈现的文本是重要的,所以要突出显示。现今所有主要浏览器都能渲染各种效果的字体。不过,未来浏览器可能会支持更好的渲染效果。 |
在线实例
文本格式化
此例演示如何在一个 HTML 文件中对文本进行格式化
预格式文本
此例演示如何使用 pre 标签对空行和空格进行控制。
"计算机输出"标签
此例演示不同的"计算机输出"标签的显示效果。
地址
此例演示如何在 HTML 文件中写地址。
缩写和首字母缩写
此例演示如何实现缩写或首字母缩写。
文字方向
此例演示如何改变文字的方向。
块引用
此例演示如何实现长短不一的引用语。
删除字效果和插入字效果
此例演示如何标记删除文本和插入文本。
HTML 文本格式化标签
标签 | 描述 |
---|---|
<b> | 定义粗体文本 |
<em> | 定义着重文字 |
<i> | 定义斜体字 |
<small> | 定义小号字 |
<strong> | 定义加重语气 |
<sub> | 定义下标字 |
<sup> | 定义上标字 |
<ins> | 定义插入字 |
<del> | 定义删除字 |
HTML "计算机输出" 标签
标签 | 描述 |
---|---|
<code> | 定义计算机代码 |
<kbd> | 定义键盘码 |
<samp> | 定义计算机代码样本 |
<var> | 定义变量 |
<pre> | 定义预格式文本 |
HTML 引文, 引用, 及标签定义
标签 | 描述 |
---|---|
<abbr> | 定义缩写 |
<address> | 定义地址 |
<bdo> | 定义文字方向 |
<blockquote> | 定义长的引用 |
<q> | 定义短的引用语 |
<cite> | 定义引用、引证 |
<dfn> | 定义一个定义项目。 |
如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039,我们一起飞!
HTML简介
HTML是用来描述网页的一种语言,它是一种超文本标记语言,由一套标记标签组成,在制作网页时,HTML使用标记标签来描述网页。
发展史
HTML:Hyper Text Markup Language超文本标记语言
超文本标记语言—在1993年6月互联网工程工作小组工作案发布(并非标准)
HTML2.0—1995年11月作为RFC1866发布,在RFC2854于2000年6月发布之后被宣布过时。
HTML3.2—1996年1月14日,W3C推荐标准
HTML4.0—1997年12月18日,W3C推荐标准
HTML4.01(微小改进)—1999年12月24日,W3C推荐标准,2000年5月15日发布基本严格的HTML4.01语法,是国标标准化组织和国际电工委员会的标准
XHTML1.0—发布于2000年1月26日,是W3C推荐标准,后来经过修订于2002年8月1日重新发布
XHTML1.1—2001年5月31日发布
XHTML2.0是W3C的工作草案,由于改动过大,学习这个新技术的成本过高而最终胎死腹中,因此,现在最常用的还是XHTML1.0标准。
目前最新的版本为HTML5,它是2004年被提出,2007年被W3C接纳并成立新的HTML工作团队,
2008年1月22日公布HTML5第一份正式草案,
2012年12月17日HTML5规范正式定稿,
2013年5月6日,HTML5.1正式草案公布。
HTML 5作为最新版本,提供了一些新的元素和一些有趣的新特性,同时也建立了一些新的规则。这些元素、特性和规则的建立,提供了许多新的网页功能,如使用网页实现动态渲染图形、图表、图像和动画,以及不需要安装任何插件直接使用网页播放视频等。目前企业开发中也在增大使用HTML5的力度
HTML的优势
h1~h6
源代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>标题标签</title> </head> <body> <h1>这是一级标题</h1> <h2>这是二级标题</h2> <h3>这是三级标题</h3> <h4>这是四级标题</h4> <h5>这是五级标题</h5> <h6>这是六级标题</h6> <h7>这是七级标题</h7>效果怎么显示不出来呢??? <h1>这是一级标题</h1> </body> </html> |
浏览器预览效果
p标签为段落标签,br标签为换行标签
源代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>段落和换行标签</title> </head> <body> <h1>北京欢迎你</h1> <p>北京欢迎你,<br>为你开天辟地</p> <p>北京欢迎你,<br/>有有勇气就会有奇迹</p> </body> </html> |
浏览器预览效果图
hr标签为水平线标签
源代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>水平线标签</title> </head> <body> <h1>漂洋过海来看你</h1> <hr> <p>为你我用了半年的积蓄,<br>漂洋过海来看你</p> <hr/> </body> </html> |
浏览器预览效果图
em为斜体标签,strong为字体加粗标签
源代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>字体样式标签</title> </head> <body> <h1>漂洋过海来看你</h1> <hr> <p>为你我用了<em>2017</em>半年的<strong><em>积蓄</em></strong>,<br> <em><strong>漂洋过海</strong></em>来看你 </p> <hr/> </body> </html> |
浏览器预览效果图
注释使用:<!--被注释的内容-->
大于号:> great than的缩写
小于号:< less than的缩写
双引号:""
版权符号:©
空格:
源代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>注释和特殊符号</title> </head> <body> <pre> 注释使用:<!--被注释的内容--> 大于号:> great than的缩写 小于号:< less than的缩写 双引号:"" 版权符号:© 空格: </pre> <!-- 我是被注释的内容,我只留给你们看,不会在页面上显示 --> 5<10>6 <br> "我是被双引号引起来的内容"<br> ©自由职业开发者公司<br> 我是 测试 空 格的 </body> </html> |
浏览器预览效果图
以上就是HTML的简单入门,后续带大家更深入的了解HTML
*请认真填写需求信息,我们会在24小时内与您取得联系。