一、元素标签
1.块级元素–单独占一行
例如h1-h6,p,div
2.行内元素(内联元素)–紧跟一起
例如i,b,strong,em,img,span
div,span是2个比较特殊的没有任何意义的标签–用途:用来装其它有语义化的标签,类似容器
二、使用样式的三种方式
1.引用外部样式文件
2.写在head里面style标签内
3.写在元素开始标签内,用style属性
三、从一层(外部文件,style标签)层叠的优先级
1.id的优先级最高
2.class其次
3.tag标签再其次
4.浏览器默认是最低的(不同浏览器默认显示的内容样式是不一致的)
四、不同引用形式混合在一起
1.style属性 内联
2.id等级最高
3.先定义的会被后面的定义覆盖
4.后引用的会覆盖前引用的
五、引用外部样式文件
六、超链接anchor
1.使用网页链接
2.同一文件夹下的内容页
3.上一层文件夹下的内容页
4.邮件地址
5.电话地址
七、href 引用
1.绝对路径/地址:http://baidu.com
2.相对路径/地址:lastday.html
八、涉及的单词
container容器
content内容
style风格
navigatin导航
section 段落 章节
article 文章 文字
aside侧边栏
footer底部信息
anchor简称a 超链接,锚点
reference简称href 引用
target目标 _blank
blank空白的
mailto
font字体
header
color颜色
span
div
cascade层叠
<!DOCTYPE html>
<html>
<head>
<title>第二课</title>
<style>
/*这是span的注释*/
span{
font-size:30px;
font-family:仿宋;
}
div{
font-size:20px;
font-family:宋体;
}
div{
#one{
color: red;
}
.lanse {
color: #000000ff ;
}
* {
margin:0;
padding:0;
}
}
</style>
<!--引用外部样式文件-->
<link type="text/css" rel="stylesheet" href="yangshi.css">
</head>
<body>
`<span>
这是第一个span的内容
</span>
<span>
这是第二个span的内容
</span>
<div id="one" style="font-size: 40px;">
这是第一个div的内容
</div>
<div id="second" class="lanse">
这是第两个div的内容
</div>
<h1>标题标签</h1>
<u1>
<li>苹果</li>
<li>香蕉</li>
<li>橘子</li>
</u1>`
<!--超链接anchor-->
<a href="http://www.baidu.com">百度一下,你就知道</a>
<!--同一文件夹下昨天的内容页-->
<a href="网页.html">昨天的内容</a>
<!--上一层文件夹下昨天的内容页-->
<a href="../网页.html">昨天的内容</a>
<a href="mailto:nitongxy@163.com">邮件地址</a>
<a href="tel://12345678">电话</a>
<div id="xiaoshuo">
<p style="line-height:200%" align="left">
在丛林沟壑之中,绵延盘旋着一条神秘的古道,它是世界上地势最高、山路最险、距离最遥远的古代商道——茶马古道,这是一条完全由马蹄和赶马人的一步一步趟出来的路,很多地段都是以羊肠小径的形式出现在陡峭的悬崖边上……
</p>
``</div>
<a href="#xiaoshuo">回到顶部</a>
</body>
</html>