美文网首页设计师学前端
设计师学习HTML/CSS之路-01

设计师学习HTML/CSS之路-01

作者: HU_Wei | 来源:发表于2018-06-25 19:24 被阅读0次

    不了解前端的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>
    

    相关文章

      网友评论

        本文标题:设计师学习HTML/CSS之路-01

        本文链接:https://www.haomeiwen.com/subject/lapyyftx.html