內(nèi)聯(lián)框架:
超鏈接:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>超鏈接<title>
</head>
<body>
<h1>我是demo12</h1>
<a >我是一個(gè)超鏈接</a>
</body>
</html>
CSS的編寫位置:
<!DOCTYPE html>
<html>
<head>
<meta charest="utf-8" />
<title>CSS</title>
<style type="text/css">
p{
color:red;
font-size:40px;
</style>
</head>
<body>
<p style="color:red;font-size:40px;">111111111111</p>
<p>11111111111</p>
<p>111111111111</p>
<p>111111111111111</p>
<p>1111111111111111111111111</p>
</body>
</html>
CSS語(yǔ)法:
<!DOCTYPE html>
<html>
<head>
<meta charest="utf-8" />
<title>CSS語(yǔ)法</title>
<style type="text/css">
/*
選擇器 聲明塊
*/
p{
color:red;
font-size:40px;
</style>
</head>
<body>
<p>哈答復(fù)客戶的發(fā)放 是飯卡上的發(fā)生flask會(huì)發(fā)生
</p>
</body>
</html>
開(kāi)發(fā)工具:
TAB:可以補(bǔ)全代碼
ctrl+回車:不在行尾也可以新建一行
ctrl+shlft+B:復(fù)制一行
ctrl+shlft+k:刪除一行
CTRL+alt+上(下):多行編輯
塊和內(nèi)聯(lián):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charest="utf-8" />
<title>塊和內(nèi)聯(lián)</title>
</style>
</head>
<body>
<div style="background-color: red; width: 200px;">
我是一個(gè)div
</div>
<div style="background-color: yellow; width: 200px;">
我是一個(gè)div
</div>
<p>我是一個(gè)p標(biāo)簽</p>
<p>我是一個(gè)p標(biāo)簽</p>
</body>
</html>
常用選擇器:
<!DOCTYPE html>
<html>
<head>
<meta charest="utf-8" />
<title>元素選擇器</title>
<style type="text/css">
p{
color: red;
}
</style>
</head>
<body>
<h1>好詩(shī)</h1>
<p>1234567</p>
<p>2345678</p>
<p>3456789</p>
<p>4567890</p>
<p>5678901</p>
<p>6789012</p>
</body>
</html>
子_后代元素選擇器:
<!DOCTYPE html>
<html lnag="en">
<head>
<meta charest="utf-8" />
<title>子元素和后代元素選擇器</title>
<style type="text/css">
span{
color:green;
}
</style>
</head>
<body>
<div>
<span>我是div標(biāo)簽的span</span>
<p><span>我是p標(biāo)簽的span<span></p>
</div>
<span>我是body標(biāo)簽中的span</span>
</body>
</html>
偽類
<!DOCTYPE html>
<html lang="en">
<head>
<meta charest="utf-8" />
<title>偽類選擇器</title>
<style type="text/css">
a{
color: red;
}
</style>
</head>
<body>
<a >訪問(wèn)過(guò)的連接</a>
<br /><br />
<a >沒(méi)訪問(wèn)過(guò)的連接</a>
</body>
</html>
偽元素