zoukankan      html  css  js  c++  java
  • 【学习】HTML基础(二)

    HTML基础(二)

    本文参考了[http://www.w3school.com.cn/html/][6]


    HTML CSS

    什么是CSS

    • 层叠样式表,从HTML4.0之后的样式都建议从html文档中剥离样式,写到css文件中
    • 例如描述文字大小、颜色、位置等的信息都写到css文件中去
    • 在Chrome浏览器上按F12可以看到页面的源码
    • 源码一般都是把样式剥离出来了

    • 层叠样式表,从HTML4.0之后的样式都建议从html文档中剥离样式,写到css文件中

    • 例如描述文字大小、颜色、位置等的信息都写到css文件中去
    • 在Chrome浏览器上按F12可以看到页面的源码
    • 源码一般都是把样式剥离出来了

      1.外部样式表

    <head>
    <link rel="stylesheet" type="text/css" href="mystyle.css">
    </head>
    • 推荐使用外部样式表,在每一个页面的html中都可以使用css里面的样式
    • 前面的rel规定当前文档与被链接文档之间的关系,stylesheet表示样式表
    • mystyle.css表示样式表和当前html在同一个目录下

      2.内部样式表

    • 在head标签里定义style标签,可以在本html文档中将css文件里的样式做继承
    • 不建议使用

      3.内联样式表

    • 在某一个标签内部加入style,单独改变这个标签
    • 不建议使用,建议全部采用外部样式表

    (后面会对css进行专门的学习)

    基本元素

    • 链接
     <a herf="www.baidu.com">nihao</a>

    链接里面也可以插入标签

    <a herf="www.baidu.com"><img src="apple.jpg"></a>

    链接不仅仅只能指向其他的网页,也可以指向本网页的其他的地方(锚 
    ) 
    就像百度百科前面的目录一样

    <a name="miao">miao</a>
    <a herf="#miao">miao</a>

    把name替换成id也可以

     <a herf="www.baidu.com" target="_blank">nihao</a>

    在新窗口打开target=”_blank” 
    从根目录寻找网页target=”_top”


    • 图片
    <img src="/img/p.jpg">

    body 可以加上background=”background.jpg” 
    width属性调整宽度 
    height属性调整高度


    • 表格
     <table>
      <tr>
        <th>表头</th>
      </tr>
      <tr>
        <td>第一行第一列</td>
      </tr>    
    </table>

    • 列表

    1.无序列表

    <ul>
      <li>nihao</li>
      <li>zaijian</li>
    </ul>

    2.有序列表

    <ol>
      <li>nihao</li>
      <li>zaijian</li>
    </ol>

    • 块级元素
    <div>
    </div>

    • 内联元素 
      将文本分块
    <span></span>

    • 类 
      在css文件或者head中的style里 
      之后就可以在块中加入class=“left”
    .left{
    text-align: left
    }

    或者可以对已有的表现设置内部的类 
    然后在之后的p标签内部可以加入class=“left”

    p.left{
    text-align: left
    }

    • 布局 
      在css文件中用井号开头,在html的div中id=“”

    • 响应式设计 
      这个要求有点高,有时间我再看

    • 头部标签
    <title>题目 必须要有
    <base target="_blank" />新窗口打开
    <meta>关键字 作者 描述
    <link rel="stylesheet" type="text/css" href="mystyle.css" />链接外部资源
    }

     

  • 相关阅读:
    java基础:6.3 封装类、Number类、格式化输出、String
    java 快捷键记录
    java基础:6.2 Object、final、abstract、内部类
    如何解决.so 文件下载到mac 失败的问题
    mac 将.so文件上传到SVN上
    限制输入内容的需求
    Android Intent调用 Uri的使用几种格式
    onItemClick的参数
    Android常见的几种RuntimeException
    android:inputType参数类型说明
  • 原文地址:https://www.cnblogs.com/bwjiang/p/7838402.html
Copyright © 2011-2022 走看看