0
点赞
收藏
分享

微信扫一扫

前端入门——HTML和CSS

单调先生 2022-01-26 阅读 90

一、什么是HTML?

HTML是用来描述网页的一种语言

·HTML指的是超文本语言(Hyper Text Makedown Language);

·HTML是一种标记语言,而不是一种编程语言;

·标记语言是一套标记标签

二、网页的组成部分

HTML(结构)、CSS(表现)、JS(行为);

三、HTML的基本语法

1、常规标记,也叫双标记;

格式:<标记 属性=“属性值”  属性=“属性值”><标记/>

例如:<head><head/>

2、空标记,也叫单标记

格式:<标记 属性=“属性值” 属性=“属性值”>

例如:<br/>

3、常用标签

(1)、文本标签(h1-h6)

<h1>一级标题</h1>

<h2>二级标题</h2>

<h3>三级标题</h3>

<h4>四级标题</h4>

<h5>五级标题</h5>

<h6>六级标题</h6>

(2)、段落标签

<p>段落</p>

(3)、换行

<br/>

(4)、水平线

<hr/>

例如:<hr color=“red” width="300px" align(对齐方式)="right">

(5)、加粗(推荐strong)

<b>加粗内容</b>

<strong>加粗强调</strong>

(6)、倾斜(推荐em)

<em>倾斜强调</em>

<i>倾斜文本</i>

(7)、删除线(推荐del)

<s>内容</s>删除线

<del>内容</del>删除线

(8)、扩展

<u>文本<u/>下划线

<sub>文本<sub/>下标

<sup>文本<sup/>上标

4、特殊符号

5、div标签和span标签

<div>内容</span>用来划分页面的区域,独占一行 

<span>内容</span>应用在对文本独立修饰的时候,内容有多宽就占用多宽的空间距离

6、列表

 7、图片标签

·图片标签的路径

 ·图片标签的属性

8、超链接标签

9、表格table

·表格的创建

·表格属性

·行tr属性

 `单元格td属性

·表格合并列(colspan)

·表格合并行(rowspan)

10、表单标签

·表单的作用:收集用户信息

·表单的属性格式

Form中method的get和post区别

四、CSS基础知识

1、什么是CSS

 2、CSS语法

(1)、每个CSS样式由两部分组成,即选择符和声明,声明又分为属性和属性值;

(2)、属性必须放在花括号中,属性和属性值用冒号连接;

(3)、每条声明用分号结束;

(4)、当一个属性有多个属性值时,属性值与属性值不分先后顺序,用空格隔开;

(5)、在书写样式中,空格、换行等操作不影响属性的显示

例如:

3、CSS的写法

内部样式、外部样式、行内样式

(1)、内部样式

 (2)、外部样式

 Link和import之间的区别

推荐用link 

(3)、行内样式

4、样式表的优先级

行内样式>内部样式>外部样式

5、CSS选择器

为什么要使用选择器?要使用CSS对HTML页面中元素实现一对一,一对多,多对一的控制

(1)、元素选择器/类型选择器(element选择器)

例如:div{width:100px;height:100px;background:red}

(2)、class选择器/类选择器

(3)、 id选择器

(4)、通配符/通配选择器 

 

(5)、群组选择器

(6)、包含选择器 

 

(7)、伪类选择器

(8)、选择器的权重

6、文本属性

检索大小写

 7、列表属性

8、背景属性

9、浮动属性

10、盒子模型

·定义:盒模型是CSS布局的基石,它规定了网页元素如何显示以及元素间的相互关系。CSS定义所有的元素都可以拥有像盒子一样的外形和平面空间,即包含边框、边界、内容。

 ·padding属性

 ·border属性

·margin属性

 

11、溢出属性

12、元素显示类型

13、定位

 

举报

相关推荐

0 条评论