设计师学前端

设计师学习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的关系

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 标签的语法

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>
上一篇下一篇

猜你喜欢

热点阅读