HTML/CSS学习记录（2）

来源：互联网发布：mac下文件编辑器编辑：程序博客网时间：2024/06/01 10:37

HTML样式

style 属性用于改变 HTML 元素的样式。

背景颜色
background-color 属性为元素定义了背景颜色：

<html><body style="background-color:yellow"><h1 style="background-color:red">This is a heading</h1><p style="background-color:green">This is a paragraph.</p></body></html>

字体、颜色和尺寸
font-family、color 以及 font-size 属性分别定义元素中文本的字体系列、颜色和字体尺寸：

<html><body><h1 style="font-family:verdana">A heading</h1><p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p></body></html>

文本对齐
text-align 属性规定了元素中文本的水平对齐方式：

<html><body><h1 style="text-align:center">This is a heading</h1><p>上面的标题相对于页面居中对齐。</p></body></html>

HTML格式化

文本格式化

<html><body><b>This text is bold</b><br /><strong>This text is strong</strong><br /><big>This text is big</big><br /><em>This text is emphasized</em><br /><i>This text is italic</i><br /><small>This text is small</small><br />This text contains<sub>subscript</sub><br />This text contains<sup>superscript</sup></body></html>

删除和插入字：

<html><body><p>一打有 <del>二十</del> <ins>十二</ins> 件。</p><p>大多数浏览器会改写为删除文本和下划线文本。</p><p>一些老式的浏览器会把删除文本和下划线文本显示为普通文本。</p></body></html>

标签描述 定义粗体文字 <big> 定义大号字 定义着重文字 定义斜体字 定义小号字 定义加重语气 定义下标字 定义上标字 <ins> 定义插入字 <del> 定义删除字

预格式文本

使用pre标签对空行和空格进行控制

<html><body><pre>这是预格式文本。它保留了      空格和换行。</pre><p>pre 标签很适合显示计算机代码：</p><pre>for i = 1 to 10     print inext i</pre></body></html>

计算机输出标签

<html><body><code>Computer code</code><br /><kbd>Keyboard input</kbd><br /><tt>Teletype text</tt><br /><samp>Sample text</samp><br /><var>Computer variable</var><br /><p><b>注释：</b>这些标签常用于显示计算机/编程代码。</p></body></html>

标签描述 <code> 定义计算机代码 <kbd> 定义键盘码 <samp> 定义计算机代码样本 <tt> 定义打字机代码 <var> 定义变量 <pre> 定义预格式文本

说明：<code>元素不保留多余的空格和拆行，如需解决该问题必须在<pre>元素中包围代码

地址

<!DOCTYPE html><html><body><address>Written by <a href="mailto:webmaster@example.com">Donald Duck</a>.<br> Visit us at:<br>Example.com<br>Box 564, Disneyland<br>USA</address></body></html>

块引用

如何使用长短不一的引用

HTML <q> 元素定义短的引用, 浏览器通常会为 <q> 元素包围引号。
用于长引用的 HTML <blockquote>, 浏览器通常会对 <blockquote> 元素进行缩进处理。

<html><body>这是长的引用：<blockquote>这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。</blockquote>这是短的引用：<q>这是短的引用。</q><p>使用 blockquote 元素的话，浏览器会插入换行和外边距，而 q 元素不会有任何特殊的呈现。</p></body></html>

HTML引文、引用和定义元素

标签描述 <abbr> 定义缩写或首字母缩写语 <address> 定义文档作者或拥有着的联系信息 <bdo> 定义文本方向 <blockquote> 定义从其他来源引用的节 <dfn> 定义项目或缩写词的定义 <q> 定义短的行内引用 <cite> 定义著作的标题

阅读全文

0 0