html
打开VScode文件,新建一个后缀为html的文件,
在右边第一行输入“!”回车,显示代码的主要结构。
<!DOCTYPE html>
意思为代码形式为HTML格式的
<html lang="en">
不用在意
<head>
<title>Document</title>
</head>
这段代码为head元素,写CSS,写样式
<body>
</body>
body元素里写HTML。
css
如何显示一个红色50P的 HELLO WORLD
记住一定要保存代码
写属性时要在head
元素里,style
内容里写样式
在body
里定义了span
或div
后,在head
里写他们的属性时,要在style
里写,
例如div{color:red;}
如果有在head里定义了多个span
,要用class
分别命名,例如
<span class="q">Hello world</span>
<div class="w">hello world</div>
这样在head
元素中写属性时可分别写不同class
的样式,例如
<style>
.q{
color: red;
display: block;
}
</style>
各个属性的意思
span{
color: blue; 字体颜色
font-size: 80; 字体大小
position: relative;
top: 50px;
left: 50px;
border: 1px solid red;
display: block;
width: 300px;
text-align: center;
padding: 20px 0;
}