一.HTML和CSS简介

1.HTML概念

HTML的全称为超文本标记语言,是一种标记语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字,图形、动画、声音、表格、链接等。

超文本是一种组织信息的方式,它通过超级链接方法将文本中的文字、图表与其他信息媒体相关联。这些相互关联的信息媒体可能在同一文本中,也可能是其他文件,或是地理位置相距遥远的某台计算机上的文件。这种组织信息方式将分布在不同位置的信息资源用随机方式进行连接,为人们查找,检索信息提供方便。

2.CSS概念

层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。

CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。

二.HTML基本代码

<!doctype>:标记于文档最前面,用于向浏览器说明当前文档使用哪种HTML标准规范。

<html>:标记于<!doctype>标记之后,也成为根标记,用于告知浏览器其自身是一个HTML文档

<html>标记标志着html文档的开始,</html>标志着html文档的结束。

<head>:标记用于定义html文档的头部信息,也成为头部标记,紧跟在<html>标记之后,主要用来封装其他位于文档头部的标记。

<head>标记标志着头部开始,</head>标记标志着头部的结束。

<body>:标记于定义html文档所要显示的内容,也成为主题标记(一个html文档只能含有一对<body>标记,切<body>标记必须在<html>标记内位于<head>头部标记之后,与<head>标记是并列关系。)

<hr />:为单位标记,用于定义一条水平线。

<title>标记用于定义HTML页面的标题,就是说给网页起个名字,必须位于<head>标记之内,(文档只能包含一对<title></title>标记)

三.CSS各种基本内容

1.导入方式

定义link标签,引入外部的css文件,编写一个名为:MyCSS.css的css文件如下:

div{
color:red;
}

在html中引用css文件:<link rel="stylesheet"  href="MyCSS.css">

2.选择器

CSS 选择器用于“查找”(或选取)要设置样式的 HTML 元素。

我们可以将 CSS 选择器分为五类:

  • 简单选择器(根据名称、id、类来选取元素)
  • 组合器选择器(根据它们之间的特定关系来选取元素)
  • 仿类选择器(根据特定状态选取元素)
  • 仿元素选择器(选取元素的一部分并设置其样式)
  • 属性选择器(根据属性或属性值来选取元素)

3.边框属性

CSS border

边框样式:

border-style 属性指定要显示的边框类型。

允许以下值:

  • dotted - 定义点线边框
  • dashed - 定义虚线边框
  • solid - 定义实线边框
  • double - 定义双边框
  • groove - 定义 3D 坡口边框。效果取决于 border-color 值
  • ridge - 定义 3D 脊线边框。效果取决于 border-color 值
  • inset - 定义 3D inset 边框。效果取决于 border-color 值
  • outset - 定义 3D outset 边框。效果取决于 border-color 值
  • none - 定义无边框
  • hidden - 定义隐藏边框

border-style 属性可以设置一到四个值(用于上边框、右边框、下边框和左边框)。

4.添加背景图片

背景颜色{background-color:}数值

背景图片{background-image:url(url)|none}

背景重复{background-repeat:inherit|no-repeat|repeat|repeat-x|repeat-y}

背景固定{background-attachment:fixed|scroll}

四.总结

HTML相当于网页的框架,css是修饰框架的东西,写网页时最好先写html再写css

html想要学好需要下功夫,在我本人编写程序时总会出错,但是出现错误不能就此放弃应该克服它。在刚开始学习时,可以先在网上找几个例子学习,在这个过程中可以一点点摸索出方法。