zoukankan      html  css  js  c++  java
  • html学习_认识html

    1、HTML骨架

    <html>----根标签

      <head>---头标签

      </head>

      <body>---主体标签

      </body>

    </html>

    2、html主要是表现网页中的元素(内容)

    a、html标签:

    双标签  <标签名></标签名>

    单标签  <标签名 />

    b、标签的相互关系:

    嵌套关系(父子、孙子)---子元素最好缩进一个tab

    并列关系(兄弟)--对齐就行

    3、开发工具

    sublime、webstorm、vscode

     4、<!DOCTYPE html>---文档类型

    告诉我们和浏览器我们使用的是哪个html版本,html有很多版本

    比较早的有html:xt

    我们目前都用的html: 5更简洁些,

    5、<meta charset=“UTF-8”>  字符集 告诉浏览器使用的字符集

    UTF-8  最大的字符集  几乎包含了所有国家用到的字符,使用后避免出现字符集不统一而引起的乱码问题

    6、标签的语义化

    7、排版标签:

    标题标签(h1-h6)、段落标签(p)、水平线(<hr />)、换行标签(<br />)

    div 、span标签(2布局标签无语义是重点)

    8、文本格式化标签:

    9、图片:一般情况下我们只需设置图片的宽度或高度一项就可以,另外的那个会等比例缩放(不至于拉伸图片)

    <img />图片的属性:src (来源的路径 必需写属性)、 alt 、title、 border、 width 、height

    10、链接标签

    外部链接 : 链接地址已http://开头

    内部链接:  只需写上去往路径

    <a> </a>属性:href(去往的路径 必需写属性)、target=“_blank”  target="_self"(默认)

    11、锚点定位(适合于较长的页面,我们可以点击某个关键词从而迅速到达页面中的某个位置)

    步骤:

     eg:                                               

    <a href="#main">主要内容</a>

    <div id="main">锚点</div>

    12、base标签

    单标签:img br hr base

    13、相对路径

    相对路径:

    a.同一级路径(./)     xx.jpg

    b.下一级路径         xx/xx.jpg

    c.上一级路径(../)    ../xx.jpg

    绝对路径:

    a.找到图片属性查看位置(C:...)(一般不会用的)

    b.复制图片地址

    14、列表标签

    a.无序列表:  ul>li

       注意事项 :ul里只能放置li标签;li标签相当于一个容器,里面可以放置所有的元素;无序列表有一些默认的样式用css搞定。 

    b.有序列表:ol>li

    注意事项 :ol里只能放置li标签;li标签相当于一个容器,里面可以放置所有的元素;有序列表有一些默认的样式用css搞定。 

    c.自定义列表:dl>dt+dd  (dd是围绕dt来解释的,dd可以写多个)

    常用如下:

  • 相关阅读:
    Count and Say leetcode
    Find Minimum in Rotated Sorted Array II leetcode
    Find Minimum in Rotated Sorted Array leetcode
    Search in Rotated Sorted Array II leetcode
    search in rotated sorted array leetcode
    Substring with Concatenation of All Words
    Subsets 子集系列问题 leetcode
    Sudoku Solver Backtracking
    Valid Sudoku leetcode
    《如何求解问题》-现代启发式方法
  • 原文地址:https://www.cnblogs.com/yangyutian/p/10409620.html
Copyright © 2011-2022 走看看