前端03

作者: 我的好昵称 | 来源:发表于2019-05-28 19:53 被阅读0次



<em><strong>
em标签用于表示一段内容的着重点
strong标签用于表示一个内容的重要性
两个标签可以单独使用,也可以一起使用
em显示为斜体,strong显示为粗体
<i>和<b>
标签会使文字变成斜体。
b标签会使文字变成粗体。
这两个标签和em和strong类似,但是这两 个标签没有语义。
所以根据html5标准,当我们只想设置文本 特殊显示,而不需要强调内容时就可以使 用i和b标签。
<small>标签表示细则一类的旁注,
浏览器在显示small标签时会显示一个比父 元素小的字号。
<p><small>&copy;2018北财. 保留所有权利.</small></p>

<cite>使用cite标签可以指明对某内容的引用或参 考。

<p>
<cite>《七龙珠》</cite>讲的是召唤神龙的故事。
</p>

<blockquote>和<q>
blockquote和q表示标记引用的文本/
blockquote用于常饮用,q用于短引用
在两个标签中还可以使用cite属性来表示引 用的地址。
孟子曾经说过:
<blockquote>天将降大任于是人也...</blockquote>
他说的真对啊!

<p>孔子曾经说过:<q>学而时习之不亦说乎</q></p>

<sup>和<sub>
sup和sub用于定义上标和下标。
上标主要用于表示类似于103中的3。
下标则用于表示类似余H2O中的2


<ins>和<del>

ins表示插入的内容,显示时通常会加上下 划线。
del表示删除的内容,显示时通常会加上删 除线。


<code>和<pre>

如果你的内容包含代码示例或文件名,就 可以使用code元素。
pre元素表示的是预格式化文本,可以使用
pre包住code来表示一段代码。
<pre>
<code>
function fun(){  alert("hello");
}
</code>
</pre>


有序列表
<ol>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ol>

无序列表
使用ul和li来创建一个无序列表。
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ul>


使用dl、dd、dt来创建一个定义列表
<dl>
<dt>定义项1</dt>
<dd>定义描述1</dd>
<dt>定义项2</dt>
<dd>定义描述2</dd>
<dt>定义项3</dt>
<dd>定义描述3</dd>
</dl>



十六进制颜色
用的最多的颜色是十六进制符号。一个颜色值, 比如:#6600FF实际上包含了三组十六进制的 数字。

font-size用来指定文字的大小

通过font-family可以同时指定多个字体。
例如:
p{font-family:Arial , Helvetica , sans-serif}

serif(衬线字体)
sans-serif(非衬线字体)
monospace (等宽字体)
cursive (草书字体)
fantasy (虚幻字体

font-style用来指定文本的斜体。
指定斜体:font-style:italic
指定非斜体:font-style:normal
font-weight用来指定文本的粗体。
指定粗体:font-weight:bold
指定非粗体:font-weight:normal
font-variant属性可以将字母类型设置为小 型大写。在该样式中,字母看起来像是稍 微缩小了尺寸的大写字母。
– font-variant:small-caps
font可以一次性同时设置多个字体的样式
 font:加粗 斜体 小型大写 大小/行高 字体
ine-height用于设置行高,行高越大则行 间距越大。
行间距 = line-height – font-size

text-transform样式用于将元素中的字母全都变成大写。
大写:text-transform:uppercase
小写:text-tansform:lowercase
首字母大写:text-transform:capitalize
正常:text-transform:none


《文本的修饰》
text-decoration属性,用来给文本添加各 种修饰。通过它可以为文本的上方、下方 或者中间添加线条。
可选值:
underline
overline
line-through
none


字母间距和单词间距
letter-spacing用来设置字符之间的间距。
word-spacing用来设置单词之间的间距。


《首行缩进》
text-indent用来设置首行缩进。
该样式需要指定一个长度,并且只对第一 行生效。

相关文章

  • 【前端】2020-03-06

    【前端】2020-03-06

  • web前端特效演示合集

    前端特效01:使用纯CSS实现书籍3D翻页效果 前端特效02:使用纯CSS实现动态太极 前端特效03:HTML5画...

  • 01 Web 前端安全相关

    01 前端安全系列(一):如何防止XSS攻击?02 前端安全系列(二):如何防止CSRF攻击?03 AJAX请求真...

  • HTML的全面review

    Date:2018-03-08 前端的三大主体 HTML ? 结构CSS ? 表现Javascript ...

  • 前端03

    1.伪类选择器 伪类专门用来表示元素的一种特殊的状态 2伪元素选择器 3选择器的优先级 内联样式ID选择器类和伪类...

  • 前端-03

    1:plate 元素选择器2:bento 元素选择器3:#fancy ID选择器4:plate apple 后代元...

  • 前端03

  • github 个人博客搭建笔记

    title: github 个人博客搭建笔记date: 2018-08-03 17:32:13tags: 前端 个...

  • do-while语句

    三个循环详细解读,你确定不看一下吗? 2017-03-26Web前端精髓 微信号:css-js 欢迎观临Web前端...

  • 前端工程化系列[04]-Grunt构建工具的使用进阶

    在前端工程化系列[02]-Grunt构建工具的基本使用和前端工程化系列[03]-Grunt构建工具的运转机制这两篇...

网友评论

      本文标题:前端03

      本文链接:https://www.haomeiwen.com/subject/tnkjtctx.html