前言：
如今各位老铁们对“如何用css设计网页”大概比较注意，同学们都想要了解一些“如何用css设计网页”的相关资讯。那么小编也在网上搜集了一些对于“如何用css设计网页””的相关知识，希望小伙伴们能喜欢，大家一起来了解一下吧！大家好，上一篇文章介绍了HTML+CSS的基础知识和开发工具，接下来就要开始实战编写了
首先在桌面创建一个新文件夹，重命名为网页开发，进入文件夹右键创建一个文本文档，然后重命名为index.html，我们的第一个网页文件就创建好了。注意：有些同学的电脑无法编辑后缀，文件夹头部有个查看，点击进去进入选项，然后再点击查看，下面有个隐藏已知文件类型的扩展名，去掉选择框确定就可以了。
打开notepad++编辑器，把index.html直接拖进去，然后在里面写上如下代码：
<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"/><title>网页设计</title></head><body><style type="text/css">body{ background: #000;}</style></body></html>直接点击index.html，浏览器会直接打开并解析，就会显示一个全黑的网页，哈哈哈！！！
那么这些标签都代表什么意思呢？首先html网页头部都会有一个版本声明，这里的<!DOCTYPE html>代表HTML5版本，每个网页都需要写上此声明，这样浏览器就能判断用哪个html版本解析当前的页面，而<html lang="zh-CN">则表示网页内容属于中文简体语法。<head>标签表示网页头部元素的容器，这里可以放网页的标题、关键词、描述等，也可以包含脚本、样式以及其他meta等其他信息。这里我写了一个标题，它就会在浏览器头部显示出来。<meta charset=utf-8"/>标签则是告诉浏览器我这个网页的编码是utf-8编码，这个很重要哦，否则网页容易出现乱码。<body>标签表示网页主体元素的容器，它包含了网页所有的html标签如：文本、图片、列表等等。以后我们编写的网页标签都需要放在这里面，这些就构成了html网页的基本格式，大家也不需要去背，知道表示什么意思就行，需要的时候直接拿来用。<style type="text/css">标签表示规定样式表的MIME类型，它告诉浏览器这里面的文本内容text要当css样式表来解析，常用的有两种引用方法（内部和外部引用），外部引用就是用<link>标签引用css文件，后面的文章我会讲解。它以分号(;)开始和结束，每个属性有一个值，属性和值用冒号分开，如：body{background:#000;}表示指定给body标签一个颜色为黑色的背景。接下来我们就开始编写我们的网页代码，我写一段图文标签，大家把下面一段代码插入到body里面
<!--HTML--><div><h2>这是我的第一个网页</h2><p>BODY标签表示网页主体元素的容器，它包含了网页所有的html标签如：文本、图片、列表等等。以后我们编写的网页标签都需要放在这里面，这里我写了一段文字，它就会在浏览器里显示出来。这些就构成了我们网页的基本格式，大家也不需要去背，知道表示什么意思就行，需要的时候直接拿来用。</p><p><img src=""></p></div><!--CSS--><style type="text/css">div { width: 300px; padding: 20px; margin: 20px; border: 1px solid #eee;}h2 { font-size: 18px; color: #000; text-align: center;}p { line-height: 24px; font-size: 14px; color: #000;}img { width: 100%;}</style>效果图如下：
这是我的第一个网页
大家可以先尝试一下解释这些标签的意义，下一篇我会详细为大家讲解，谢谢观看！！！
版权声明：
本站文章均来自互联网搜集，如有侵犯您的权益，请联系我们删除，谢谢。
标签： #如何用css设计网页 #notepad新建html #html建表 #html新建页面
