设计师学习HTML/CSS之路-01
2018-06-25 本文已影响0人
HU_Wei
不了解前端的UI不是好美工,以下是慕课网HTML+CSS基础教程学习笔记,不废话,Start!
第1章 Html介绍
1-1 代码初体验,制作我的第一个网页
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>制作我的第一个网页</title>
</head>
<body>
<h1>hello world</h1>
</body>
</html>
1-2 Html和CSS的关系
- HTML是网页内容的载体
- CSS样式是表现
- JavaScript用来实现网页上的特效
1-3 html标签
<h1>这是标题标签</h1>
<h1>这是标题标签</h1>
<p>这是段落标签,这是段落标签,这是段落标签,这是段落标签,这是段落标签。</p>
<p>这是段落标签,这是段落标签,这是段落标签,这是段落标签,这是段落标签。</p>
<img src="https://user-gold-cdn.xitu.io/2018/6/24/1642f6b0a5e42d5d?w=280&h=160&f=jpeg&s=4072">
这是图片标签<img src="https://user-gold-cdn.xitu.io/2018/6/24/1642f6b0a5e42d5d?w=280&h=160&f=jpeg&s=4072">
1-4 标签的语法
< 和 >括起来,就是一个标签
-
<p> 开始
</p> 结束
标签与标签之间是可以嵌套的<div><p>这是一段嵌套文字</p></div>
HTML标签建议用小写
1-5 html文件基本结构
<html>
<head>...</head>
<body>...</body>
<html>
<html></html>称为根标签,所有网页标签都在之中。
<head>标签定义文档头部,它是所有头部元素的容器。其中包括<title> <script> <style> <link> <meta>等。这些内容不会在页面显示。
在<body>和</body>标签之间的内容是网页的主要内容。如<h1> <p> <a> <img>等内容标签,这些内容是会在页面显示的。
1-6 head标签
<head>
<title>网页标题信息,出现在浏览器标题栏中,帮助搜索引擎搜索,此内容会显示在网页标签上</title>
<meta>
<link>
<style>...</style>
<script>...</script>
<head>
1-7 HTML代码注释
代码注释的作用是帮助程序员标注代码用途
语法:
<body>
<!--注释 begin-->
<div>
<p>一站式报名咨询、助学答疑服务,无论是报名、选课、学习、做作业、考试、写论文,毕业,这里都有专业老师为你答疑解惑!<a href="#">向报名顾问咨询</a></p>
</div>
<!--注释 end-->
</body>