HTML5常⽤的⽂本标签及css字体样式属性HTML5常⽤的⽂本标签
标签描述
标题标签HTML中⼀共有六级标题，标题按字号⼤⼩从⼤到⼩为H1、H2、H3、H4、H5、H6 <p>⽤于定义HTML中的段落fontweight属性bold
<br>和<wbr>
<br>标签⽤于插⼊⼀个简单换⾏符，⽤来输⼊空⾏。
<wbr>标签规定⽂本在什么时候适合添加换⾏符，作⽤是建议浏览器可以在标记处断⾏，但只是建议不⼀定是必定换⾏，还有根据
整⾏⽂字的长度来定
<details> 和
<summary>
<details> ⽤于描述⽂档和⽂档某个部分的细节，可以与<summary>标签⽤于定义这个描述⽂档的标题<
bdi><bdi>标签⽤于设置⼀段⽂本，使其脱离其⽗标签的⽂本⽅向设置，在发布⽤户评论或其他您⽆法完全控制的内容时很有⽤
<ruby>和<rt>还有
<rp>
<ruby>标签⽤于定义ruby注释(中⽂注⾳或字符)，与<rt>标签⼀同使⽤<rt>标签⽤于定义字符(中⽂注⾳或字符)的解释或发⾳。
<rp>标签在ruby注释中使⽤，以定义不⽀持<ruby>标签的浏览器所显⽰的内容
<mark><mark>标签主要⽤来在视觉上向⽤户呈现那些需要突显或⾼亮显⽰的⽂字
<time><time>标签⽤于定义⽇期或时间，也可以两者同时
<meter><meter>标签⽤于定义度量衡
<progress><progress>标签⽤于定义任何类型任务的运⾏进度
标题标签
  <h1>~<h6>⽤处是为了命名标题，<h1> 定义最⼤的标题。<h6>⽤来定义最⼩的标题；标题标签主要⽬的不是为了设置字体⼤⼩，主要作⽤是对浏览器索引进⾏优化。
例⼦:
<h1>⼀级标题</h1>
<h2>⼆级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
P标签
  段落标签可以只在块（block）内指定段落，也可以把段落和其他段落、列表、表单和预定义格式的⽂本⼀起使⽤。总的来讲，这意味着段落可以在任何有合适的⽂本流的地⽅出现，例如⽂档的主体中
、列表的元素⾥，等等
例⼦：
<p>这是⼀个段落</p>
br和wbr标签
  <br>标签的⽬的是输⼊空⾏，不是为了换⾏；
<wbr>标签，软换⾏符；全称是 Word Break Opportunity(单词换⾏时机)，IE并不⽀持wbr；在浏览⽹页中，如果⽂本太长，浏览器会⾃动对⽂本换⾏，如果担⼼浏览器会在不恰当的位置换⾏，那么就可以⽤标签来添加换⾏时机
例⼦：
<p>单词<wbr>可以<wbr>在这些地⽅<wbr>换⾏</p>
<details> 和<summary>标签
  details⽤来对显⽰在页⾯的内容做进⼀解释⾥⾯；接着是标题，这⾥⾯的内容⼀般简短，具有总结性，
会展⽰在页⾯；细节⼀开始是隐藏的，当点击时便会展现。可以为details标签设置open属性，即打开⽹页时会默认展开。
例⼦:
<details>
<summary>details和summary标签</summary>
<p>details</p>
<dl>
<dd>细节</dd>
<dd>⽤于显⽰页⾯的内容的解释</dd>
</dl>
</details>
<bdi>标签
  <bdi>全称是Bi-directional Isolatio(双向隔离);
<bdi>标签主要是让⽂字的⽅向发⽣变化，从左向右或者从右向左。它有⼀个属性dir，⽤来定义⽂本的⽅向，属性值为ltr，⽂本从左向右正常⽅向，属性值为rtl，⽂本从右向左；默认属性值为auto。例⼦:
<p>This <bdi dir="ltr">is</bdi> an bdi.</p>
<ruby>和<rt>还有<rp>
  标签定义 ruby 注释（中⽂注⾳或字符）。
与 <ruby> 以及<rt> 标签⼀同使⽤：
ruby 元素由⼀个或多个字符（需要⼀个解释/发⾳）和⼀个提供该信息的 rt 元素组成，还包括可选的 rp 元素，定义当浏览器不⽀持“ruby” 元素时显⽰的内容。例如:
<ruby>
王 <rp>(</rp><rt>wang</rt><rp>)</rp>
</ruby>
<mark>
  标签定义带有记号的⽂本，在需要突出显⽰⽂本时使⽤；例如：
<p>这段⽂字的 <mark>我</mark>会突出显⽰.</p>
<time>
  该元素能够以机器可读的⽅式对⽇期和时间进⾏编码；还有两个属性
datetime 规定⽇期 / 时间。否则，由元素的内容给定⽇期 / 时间。
pubdate 指⽰ 元素中的⽇期 / 时间是⽂档（或
元素）的发布⽇期。例⼦：
<p>我们每天早上 <time>7:00</time> 上课</p>
<p>我在 <time datetime="2020-02-14">情⼈节</time> 待在家⾥</p>
<meter>
  标签定义已知范围或分数值内的标量测量。也被称为 gauge（尺度）。例如磁盘⽤量、查询结果的相关性即可使⽤常⽤属性是：
属性描述
max规定范围的最⼤值。
min规定范围的最⼩值
value必需值规定度量的当前值
代码例如:
<meter value="1" min="1" max="10">1 out of 10</meter><br>
<meter value="0.5">50%</meter>
<progress>标签
⽤来表⽰现在的进度 ；常⽤属性有
属性描述
max规定任务⼀共需要多少⼯作。
value规定已经完成多少任务。
例如:
<progress value="22" max="100"></progress>
css字体样式属性
color
定义元素内⽂字颜⾊。
语法：color：颜⾊名|⼗六进制|RGB
font-size
定义元素内⽂字⼤⼩。
语法：font-size：绝对单位(px)|相对单位(em)。
font-family
定义元素内的字体。
语法：font-family：字体，字体集
font-weight 字体粗细 定义字体的粗细，
属性值为：normal(默认值，等于400）、bold、bolder、lighter、100~900（100的整数倍）。
font-style 定义元素的字体风格，如设置斜体、倾斜或正常字体
常⽤属性为normal(默认值)，italic(斜体),oblique(倾斜)
word-wrap 允许长单词或 URL 地址换⾏到下⼀⾏。
常⽤属性：
  normal 只在允许的断字点换⾏（浏览器保持默认处理）。
  break-word 在长单词或 URL 地址内部进⾏换⾏
@font-face
   允许你输⼊⾃⼰的字体出现在⽹站上，即使在特定的字体在访问者的计算机上没有安装。
语法规则:@font-face {
font-family: <FontName>;
src: <source> [<format>][,<source> [<format>]]*;
[font-weight: <weight>];
[font-style: <style>];
}(属性可以⾃查)
例如:
@font-face {
  font-family: 'ET';  /*声明⼀个名为ET的字体变量*/
  src: url('')，local('');
}
CSS外观属性
属性效果
color⽂本颜⾊
letter-spacing字体间距 属性为normal 或px em 允许负值
word-spacing单词间距 中⽂字体⽆效
line-height⾏间距 px em %
text-transform⽂本转换 none 默认值 capitalize ⾸字母⼤写 uppercase 全部字符转换为⼤写 lowercase 全部字符转换为⼩写text-decoration⽂本装饰 none underline overline line-through删除线text-align⽔平对齐⽅式 left right center
text-indent⾸⾏缩进 建议使⽤em
white-space空⽩符处理 normal pre 预格式化 nowrap空格空⾏⽆效

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。