HTML/CSS 学习笔记1

最新推荐文章于 2025-04-24 09:09:44 发布

原创最新推荐文章于 2025-04-24 09:09:44 发布 · 176 阅读

0 ·

CC 4.0 BY-SA版权

程序人生专栏收录该内容

2 篇文章

订阅专栏

本文总结了HTML和CSS的基础知识，包括HTML段落、折行、样式设置，以及文本对齐等关键概念。通过实例展示了如何使用style属性改变HTML元素的样式，如背景颜色、字体、颜色、尺寸和文本对齐。

W3school基础教程学习总结-HTML/CSS

初学者个人学习总结

HTML段落
<p> 是块级元素，浏览器会自动在段落前后添加空行
HTML折行
在不产生新段落的情况下进行换行，使用<br />
注意：HTML代码中所有连续的空格或空行（换行）都会被算作一个空格
HTML样式
style 属性用于改变HTML元素的样式。

<html>
<body style="background-color:PowderBlue;">

<h1>Look! Styles and colors</h1>

<p style="font-family:verdana;color:red">
This text is in Verdana and red</p>

<p style="font-family:times;color:green">
This text is in Times and green</p>

<p style="font-size:30px">This text is 30 pixels high</p>

</body>
</html>

背景颜色 background-color
字体、颜色、尺寸 font-family、color、font-size
文本对齐 text-align

<html>

<body style="background-color:yellow">
<h2 style="text-align:center">This is a heading</h2>
<p style="font-family:arial;color:red;font-size:20px;">The hading above is aligned to the center of this page.</p>
</body>

</html>

HTML引用（Quotation）
<q>元素定义短的引用，通常包围引号

<p>WWF的目标是：<q>构建人与自然和谐共存的世界。</q></p>

元素定义被引用的节，用于长引用；通常设置缩进处理。

<p>以下内容引用自 WWF 的网站：</p>
<blockquote cite="http://www.worldwildlife.org/who/index.html">五十年来，WWF 一直致力于保护自然界的未来。
世界领先的环保组织，WWF 工作于 100 个国家，
并得到美国一百二十万会员及全球近五百万会员的支持。</blockquote>