关于自学HTML中遇到的各类细节问题

1.<a>表示链接标签，类似的有<img src>.链接的地址在<base>中填写。<base href="http://......."/>

2.<base>标签只能在头部中定义，并且只能出现一个。

3.<link>只能在头部中定义，但是可以出现多次。其中的href属性来指向所连接文档的url。他的值可以使任何有效的文档的url。

4.向前链接和反转链接rel/rev,二者可以同时包含在一个link中，也可以同时创建多个link标签。

5.link标签与外部链接（与css文件链接）。用到的是link的type属性。

6.<p>p标签标示段落。<p class =添加css样式中函数

<link href="main.css" rel="stylesheet " type="text/css" />   css样式中：

.p1{
font-size:10px;

7.用<style>标签为文档创建内部样式表

<style>只能在头部中出现，但可以在头部中多次出现。是唯一为文档创建内部样式表。用到的属性type。用的语言即使css，相当于潜藏在html内部的css。

例如：

    <title>

        style标签设置文档的类型

    </title>

    <meta charset="utf-8" />

    <style type="text/css">

        .p1{font-size:10px;}

        .p2{font-size:20px;}

        .p3{font-size:30px;}

    </style>

</head>

<body>

    <p class="p1">我喜欢你</p>

    <p class="p2">我喜欢你</p>

    <p class="p3">我喜欢你</p>

</body>

</html>

运行结果：省略：

8.根据不同的媒体设备设置样式：如style 的media属性，指向不同的设备。

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

    <meta charset="utf-8" />

    <style type="text/css">

        @media print {

           p{font-weight:bold;}

           }

            @media screen{

                p{font-weight:lighter ;}

            }

            @media print,screen{

                p{font-size:20px;}

            } 

    </style>

</head>

<body>

    <p>我喜欢你</p>

    <p>我喜欢你</p>

    <p>我喜欢你</p>

</body>

</html>

9.1<script>标签。为html添加脚本程序，脚本程序可以写在script内，也可以使用外部脚本文件。能使网页页面变得更加生动，并且能在客户端相应一定的事件，从而使页面具有良好的交互性。

script标签的type属性设置脚本语言的类型。通常有text/javascript和text/jsscript.通常使用前者。

例，当页面加载完成时弹出一个对话框。

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title>

        设置脚本的类型

    </title>

    <script type="text/javascript" >

        window.onload = function () {

            alert("Hello World");

        }

    </script>

    <meta charset="utf-8" />

</head>

<body>

</body>

</html>

9.2外部脚本，通常Javascript与html分离，一般存放在.js的文件中。然后通过script的src属性引用该文件。

核心代码： <script type="text/javascript" src="mian.js">。

js文件中：

window.onload = function () {
alert("我喜欢你");
}

10<meta>标签，定义元数据，一把通过name或者http-equiv属性指定关键字。每一个关键字表示一个元数据段，通过content属性的设置该关键字对应的值来描述该元数据段。

meta不在页面中显示，但对网页的显示很重要。

meta标签定义的元数据，其中最重要的是：keywords和description。其中keywords描述文档的关键字，为搜索引擎提供线索，非常有用。description为搜索引擎提供一份关于文档的简单说明，非常有用。

HTML自学基础的更多相关文章

  1. Java自学基础、进阶、项目实战网站推荐

    推荐一个自学的好平台,有Java基础,前端,后端,基础的内容都有讲解,还有框架的讲解和实战项目,特别适合自学 JAVA 自学网站 JAVA 练习题 Spring 教程 Mybatis 教程 Sprin ...

  2. java自学基础、项目实战网站推荐

    推荐一个自学的好平台,有Java前端,后端,基础的内容都有讲解,还有框架的讲解和实战项目,特别适合自学 JAVA 自学网站 JAVA 练习题 Mybatis 教程 Spring MVC 教程 模仿天猫 ...

  3. python自学基础1week

    一.python老师介绍 二.为什么要学习python? 三.学习python有前途吗? 疗程1:语言基础 疗程2:网络编程 疗程3:web基础开发 疗程4:算法&设计模式 疗程5:pytho ...

  4. Python 自学基础（一）——元组 字典 文件操作

    格式化输出 name = input("请输入你的名字:") age = input("请输入你的年龄:") msg = ''' -------------in ...

  5. Python 自学基础（四）——time模块，random模块，sys模块，os模块，loggin模块，json模块，hashlib模块，configparser模块，pickle模块，正则

    时间模块 import time print(time.time()) # 当前时间戳 # time.sleep(1) # 时间延迟1秒 print(time.clock()) # CPU执行时间 p ...

  6. Java自学基础用法

    在慕课上面简单学习了一下java语言的用法 简单的用法总结记录一下. 代码(学习输入,输出): package hello; import java.util.Scanner; public clas ...

  7. OC语言自学基础知识总结

    一.成员变量的作用域 二.点语法 三.构造方法 四.分类 五.类的本质 六.自动生成getter和setter方法 七.description方法 八.id类型 九.SEL 一.成员变量的作用域 @p ...

  8. Java自学路线图之Java基础自学

    自学Java要从Java基础语法开始自学,自学Java的过程中打好基础是很重要的!首先自学:面向对象基础,API基础,集合基础.这些对Java小白的数学和英语能力的要求门槛不高,在学习的过程中积累相应 ...

  9. 从零基础到拿到网易Java实习offer，谈谈我的学习经验

    微信公众号[程序员江湖] 作者黄小斜,斜杠青年,某985硕士,阿里 Java 研发工程师,于 2018 年秋招拿到 BAT 头条.网易.滴滴等 8 个大厂 offer,目前致力于分享这几年的学习经验. ...

随机推荐

  1. KlayGE 4.4中渲染的改进（三）：高质量无限地形

    转载请注明出处为KlayGE游戏引擎,本文的永久链接为http://www.klayge.org/?p=2761   本系列的上一篇讲了DR中的一些改进.本篇开始将描述这个版本加入的新功能,高质量地形 ...

  2. js连续指定两次或者多次的click事件（解决办法）

    setTimeout (表达式,延时时间)setTimeout(表达式,交互时间)延时时间/交互时间是以豪秒为单位的(1000ms=1s) setTimeout  在执行时,是在载入后延迟指定时间后, ...

  3. Request 接收参数乱码原理解析三：实例分析

    通过前面两篇<Request 接收参数乱码原理解析一:服务器端解码原理>和<Request 接收参数乱码原理解析二:浏览器端编码原理>,了解了服务器和浏览器编码解码的原理,接下 ...

  4. office快速制作简历

    毕业的一年是由学校向社会转变的一年,面临着人生的一个重大转折--找工作.在如今信息爆炸的时代,纵使力拔山兮气盖世也难免会被遗落芳草之中而不得一展宏图.对未来的憧憬,对美好生活的向往,或多或少你需要一份 ...

  5. IOS开发－KVO

    一.什么是kvo? key-value observing,观察者模式 观察者,观察对象属性的变化,当被观察者该属性发生变化时,观察者会接收到通知,可以在回调函数中做相应的处理 二.有什么作用? 变化 ...

  6. [git]merge和rebase的区别

    前言 我从用git就一直用rebase,但是新的公司需要用merge命令,我不是很明白,所以查了一些资料,总结了下面的内容,如果有什么不妥的地方,还望指正,我一定虚心学习. merge和rebase ...

  7. jQuery DOM操作

    对节点的操作 查找节点 查找节点可以直接利用jQuery选择器来完成,非常便利. 插入节点 jQuery提供了8种插入节点的方法. 序号 方法 描述 实例 1 append() 向每个匹配的元素内部追 ...

  8. 基于HTML5树组件延迟加载技术实现

    HT for Web的HTML5树组件有延迟加载的功能,这个功能对于那些需要从服务器读取具有层级依赖关系数据时非常有用,需要获取数据的时候再向服务器发起请求,这样可减轻服务器压力,同时也减少了浏览器的 ...

  9. Java魔法堂：类加载器入了个门

    一.前言 <Java魔法堂:类加载机制入了个门>中提及整个类加载流程中只有加载阶段作为码农的我们可以入手干预,其余均由JVM处理.本文将记录加载阶段的核心组件——类加载器的相关信息,以便日 ...

  10. 30天C#基础巩固------集合，File(文件操作 ),Encoding处理字符集

    一:泛型    关于泛型我自己也不是很好的理解,但是具体的运用还是可以的,可以这样的理解,我们定义一个数组,但是不知道将来它是保存什么类型的值,很是矛盾,这个时候泛型就出现了,它可以解决这个场景,li ...