HTML常用标签及CSS基础

目录

HTML常用标签

常用标签

布局标签

图片标签

行内元素和块元素

css基本知识

css发展历史

css作用

css引用方式

css三大特性

css常用属性

---

HTML常用标签

常用标签

1.标题标签：h1-h6

是块元素，一般一个页面只有一个h1

2.段落标签：p

<p>段落标签</p>

3.hgroup标签

<hgroup>

         <h1>mm</h1>

</hgroup>

4.强调标签em strong

mmmmm<em>n</em>语义

nnnnnnnn<strong>m</strong>内容

5.引用标签q blockquote

<blockquote>hello</blockquote>

<q>hi</p>

6.换行标签br

换行在行末，可无</br>

7.hr标签

<hr>分割线的作用

8.center作用为剧中

9.del标签 删除标签

10.div标签

区块，也是块元素

<div>mmmm</div>

11.span标签

包裹文字更易被识别选择

布局标签

div 块元素

header 网页头部

main 主体

footer 底部

nav 导航

aside 相关内容

article 文章

section 独立的区块

图片标签

1.src属性：引入图片路径

./或../开头

./在同一目录下

../到上一级目录

2.alt属性

3.width属性 宽度等

4.height属性 高度

行内元素和块元素

块元素用于布局

1.独占一行，从下往上依次排列

2.块元素宽度是父元素的100%

3.块元素高度默认是被内容撑开

行内元素

1.不会占一行

2.可自定义宽和高

css基本知识

css发展历史

css诞生于20世纪90年代（Tim Berners-Lee）发明万维网。

css作用

1.美化界面，如设置标签文字大小，颜色，字体加粗等；

2.控制页面布局，如设置浮动，定位等；

3.网页更丰富多彩，布局更灵活；

4.HTML专做框架实现，CSS专做样式。

css引用方式

1.行内样式：行间样式，内联样式，行嵌样式

只用于当前标签，不适用于后期维护

2.行内样式：

作用于当前文件，CSS写在HTML中，而一个文件包含多个HTML，若HTML文件较少，CSS代码也不多，可以采用这种方式

3.链入外部样式表：将网页链接到外部样式表，先创建一个CSS文件吗，再在HTML中通过链接此CSS文件，再在HTML中通过链接此CSS文件

4.导入外部样式表：通过@import引入其他的CSS文件

css三大特性

1.层叠性：设置相同样式，则会覆盖另一个冲突的样式，层叠性主要解决样式冲突问题

2.继承性：会继承父标签某些样式，如文本颜色和字体

3.优先级：当同一个元素指定多个选择器就会由优先级产生；

                 选择器相同，则执行层叠性；

                选择器不同，则根据选择器权重执行。

css常用属性

1.文本设置

a.font-size:字号参数

b.font-style:字体格式

c.font-weight:字体粗细

d.颜色属性：

color：参数

2.超链接：

a.text-decration:参数；

underline下划线；

overline上划线；

line-through：删除线；

blink：文字闪烁

none：不显示效果

3.背景：

a.颜色；b.图片重复；c.图片固定

4.区块

a.单词间距

b.字母间距

c.文本对齐

d.垂直对齐

e.文本缩进

f.空格

g.显示样式

5.方框

a.height高度

b.width

c.padding高度

d.margin外边距

e.float(不会）

f.clear

6.边框

a.样式b.宽度c.颜色

7.列表

list-style-type列表样式

8.鼠标