HTML 基础注意点
语法规范
HTML 语言是由标签组成的,标签种类繁多,但遵循统一的语法规范。HTML文档以<!DOCTYPE html>开头,及标签语法格式为:
<标签名 属性名1="属性值1" 属性名2="属性值2"> 内容 </标签名>
其中标签名为该标签的名称,属性名及属性值用来确定标签的属性及属性值,例如:<div class="header">
即为一个div标签,其属性值为"header"。
常用标签及属性
HTML常用标签有:<div>
、<span>
、<p>
、<strong>
等,每个标签有其特殊的属性。如下所示:
<div>
: 用于定义HTML文档中划分区块的通用容器标签。<span>
: 在行内定义小段文字或者构建代码间关系的标签。<p>
: 用于定义段落的标签。<strong>
: 用于定义粗体文本的标签。
示例说明一
<!DOCTYPE html>
<html>
<head>
<title>HTML示例</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./style.css">
</head>
<body>
<div class="header">头部</div>
<div class="main">
<p>这是第一段文字</p>
<p>这是第二段文字</p>
</div>
<div class="footer">底部</div>
</body>
</html>
以上示例中包括使用常见标签div、p和设置CSS样式表。
CSS 基础注意点
选择器
CSS 通过选择器来定义属性规则,常见的选择器有:标签选择器、类选择器、ID选择器和伪类/伪元素选择器等。
属性
CSS有很多属性可供设置,以下列出常用属性。
color
: 定义文字颜色。background-color
: 定义背景颜色。font-size
: 定义字体大小。text-align
: 定义文字对齐方式。
示例说明二
<!DOCTYPE html>
<html>
<head>
<title>CSS示例</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.main {
width: 80%;
margin: 0 auto;
}
.header {
color: white;
background-color: blue;
text-align: center;
}
p {
font-size: 16px;
}
</style>
</head>
<body>
<div class="header">头部</div>
<div class="main">
<p>这是第一段文字</p>
<p>这是第二段文字</p>
</div>
<div class="footer">底部</div>
</body>
</html>
以上示例中包括给元素添加CSS样式的方法和使用class选择器等。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:html、css基础注意点(前端必看篇) - Python技术站