第二周笔记

最新推荐文章于 2024-03-28 22:50:52 发布

Ascssy

最新推荐文章于 2024-03-28 22:50:52 发布

阅读量63

点赞数

分类专栏：笔记文章标签： html

本文链接：https://blog.csdn.net/weixin_48999849/article/details/115187009

版权

笔记专栏收录该内容

5 篇文章 0 订阅

订阅专栏

HTML属性

1.HTML属性的作用
HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。属性总是以名称/值对的形式出现，比如：name=“value”。属性总是在 HTML 元素的开始标签中规定。

2.始终为属性值加引号
属性值应该始终被包括在引号内。双引号是最常用的，不过使用单引号也没有问题。在某些个别的情况下，比如属性值本身就含有双引号，那么必须使用单引号，例如：
<img name='Bill "HelloWorld" Gates' src="w3school.jpg" width="104" height="142" />

3.HTML元素的核心属性
(1)文本格式化标签

<b>		定义粗体文本。				<big>	定义大号字。
<em>		定义着重文字。				<i>		定义斜体字。
<small>	定义小号字。					<strong>	定义加重语气。
<sub>	定义下标字。					<sup>	定义上标字。
<ins>	定义插入字。					<del>	定义删除字。
<u>		为文本添加下划线

(2)“计算机输出”标签

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

(3)引用和术语定义

<abbr>		定义缩写。			<acronym>		定义首字母缩写。
<address>		定义地址。			<bdo>		定义文字方向。
<blockquote>	定义长的引用。		<q>			定义短的引用语。
<cite>		定义引用、引证。		<dfn>		定义一个定义项目。

4.HTML超链接
(1)HTML超链接target属性
使用 Target 属性，你可以定义被链接的文档在何处显示。下面的这行会在新窗口打开文档：
<a href="http://www.w3school.com.cn/" target="_blank">Visit W3School!</a>

(2)HTML超链接name 属性
name 属性规定锚（anchor）的名称。name 属性用于创建 HTML 内部的书签。当使用命名锚（named anchors）时，我们可以创建直接跳至页面中某个节的链接，这样使用者就无需不停的滚动页面来寻找他们需要的信息。例如：
HTML 文档内部的已命名的锚：<a name="tips">Useful Tips Section</a>。然后，我们创建指向相同文档中“有用的提示”部分的链接：<a href="#tips">Visit the Useful Tips Section</a>或者，创建从另一个页面指向该文档中“有用的提示”部分的链接：<a href="http://www.w3school.com.cn/html_links.htm#tips">Visit the Useful Tips Section</a>

在上面的代码中，我们将 # 符号和锚名称添加到 URL 的末端，就可以直接链接到 tips 这个命名锚了。

内联样式

当特殊的样式需要应用到个别元素时，就可以使用内联样式。使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。

HTML样式实例 - 背景颜色

背景色属性（background-color）定义一个元素的背景颜色

早期背景色属性（background-color）是使用 bgcolor 属性定义。

HTML 样式实例 - 字体, 字体颜色，字体大小

我们可以使用font-family（字体），color（颜色），和font-size（字体大小）属性来定义字体的样式:

现在通常使用font-family（字体），color（颜色），和font-size（字体大小）属性来定义文本样式，而不是使用标签。

<body>
  <p style="color:#FF0000";>Red paragraph text</p>
</body>

<body>
  <p style="color:rgb(255,0,0);">Red paragraph text</p>
</body>

<body>
  <p style="color:rgba(255,0,0,0.5);">Red paragraph text</p></body>

<body>
  <p style="color:hsl(0,100%,50%);">Red paragraph text</p></body>

<body>
  <p style="color:hsla(0,100%,50%,1);">Red paragraph text</p></body>

HTML 样式实例 - 文本对齐方式

使用 text-align（文字对齐）属性指定文本的水平与垂直对齐方式

文本对齐属性 text-align取代了旧标签

。

示例加粗样式：右对齐段落

<p align="right">This is some text in a very short paragraph</p>

内部样式表

当单个文件需要特别样式时，就可以使用内部样式表。可以在部分通过

<head>
<style type="text/css">body {background-color: red}
p {margin-left: 20px}
</style>
</head>

外部样式表

当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。使用外部样式表，你就可以通过更改一个文件来改变整个站点的外观。

<head>
<link rel="stylesheet" 
type="text/css" 
href="mystyle.css">
</head>

Ascssy

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
第二周笔记

如何使用CSSCSS 是在 HTML 4 开始使用的,是为了更好的渲染HTML元素而引入的.CSS 可以通过以下方式添加到HTML中:内联样式- 在HTML元素中使用"style" 属性内部样式表 -在HTML文档头部区域使用内联样式当特殊的样式需要应用到个别元素时，就可以使用内联样式。使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。HTML样式实例 - 背景颜色背景色属性（background-color）定义一个元素的背景颜色早期背景色属性（ba
复制链接

扫一扫