常用的文字类基本标签

段落：p
标题文字 ：h1~h6
超链接：a，必须属性href，后跟跳转地址
图片：img，必须属性src，后跟图片地址
字体斜体：em、i
文字加粗：b、strong
文字下划线：u
文字删除线：s、del、strike
强制换行：br
字体：font
文本：span（行标签，只占自己本身部分）

meta

meta标签标签位于文档的头部，不包含任何内容，有下列部分常用的属性：
1、utf-8 万国码 解决乱码问题、
charset 字符设置 规定网页的文字编写模式
<meta charset="utf-8" />
2、keywords（关键词）" content（内容）
<meta name ="keywords" content="网上商城,网上购物,生鲜,食品"/>
3、description(描述信息)
<meta name="description"content="网上商城"/>

几种文字类基本标签的区别

  • 强制换行br和文字段落p的区别
  1. 段落间距方面

　　　　p标签的段落间距较大
　　　　br标签的段落间距较小

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

    </head>

    <body>

        <p>我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落
　　　　　　我是一个段落我是一个段落我是一个段落我是一个段落

         </p>

        <p>我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落
　　　　　　我是一个段落我是一个段落我是一个段落我是一个段落

         </p>

        <p>我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落
　　　　　　　我是一个段落我是一个段落我是一个段落我是强制换行

         <br/>我是强制换行我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落
　　　　　　　　我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落

        </p>

    </body>

</html>

　　　　这行代码的显示结果如下：

　　　　可以看到前面两个段落标签p的段落间距较大
　　　　后面强制换行的段落间距较小

　　　2.闭合特征方面：　　

　　　　p标签是双标签
　　　　br标签是单标签

  • 标题文字h1~h6的u区别

    <!DOCTYPE html>
    
<html>
    
    <head>
    
        <meta charset="utf-8">
    
        <title></title>
    
    </head>
    
    <body>
    
        <h1>我是h1</h1>
    
        <h2>我是h2</h2>
    
        <h3>我是h3</h3>
    
        <h4>我是h4</h4>
    
        <h5>我是h5</h5>
    
        <h6>我是h6</h6>
    
    </body>
    
</html>

    效果如下：

  • p标签、font标签和span标签的区别

    p是块标签，自己独占一行
    font 可定义字体的颜色、大小、粗细、字体等
    span 作为行标签，只占自己本身部分，本身没有任何属性


meta标签、常用的文字类标签及其区别的更多相关文章

  1. video标签常用属性及说明

    video标签常用属性(在标签内部使用) video常用API属性及方法(API属性是供JS调用的,不在video标签元素中直接使用)

  2. /.nav-tabs :是普通标签页 .nav-pills:胶囊式标签页 action ;默认的激活项，给<li>加默认显示的是哪个标签页内容 .nav是标签页的一个基类，给ul加 .nav-stacked: 垂直排列BootStrap

    <meta name="viewport" content="with=device-width, initial-scale=1, user-scalabe=no ...

  3. 初学HTML 常见的标签(三) 插入类标签

    第三篇博客, 这次说的是插入链接类标签, 我们平常在网页中经常能看到蓝色的链接类标签, 或者是一张图片, 一个电邮, 这些都是插入链接类的标签起的作用. <a></a>链接标签 ...

  4. 前端 HTML body标签相关内容 常用标签 表单标签 form里面的 input标签介绍

    input标签用于接收用户输入.可以利用input 可以做登录页面 input标签是行内块标签 <input> 元素会根据不同的 type 属性,变化为多种形态. name属性:表单点击提 ...

  5. 盒子总结,文本属性操作,reset操作,高级选择器,高级选择器优先级,边界圆角(了解),a标签的四大伪类,背景图片操作,背景图片之精灵图

    盒子总结 ''' block: 设置宽高 1.没有设置宽,宽自适应父级的宽(子级的border+padding+width=父级的width) 2.没有设置高,高由内容撑开 设置了宽高 一定采用设置的 ...

  6. web（四）html表单类标签

    表单类标签 操作者用于输入信息,并将信息提交给服务器的标签集合. 表单标签介绍 form标签:表单元素(其余标签)标签的容器标签 input标签:用于用户信息输入的标签. button标签:按钮标签. ...

  7. 超链接标签的CSS伪类link,visited,hover,active

    CSS伪类,是一种特殊的类,它针对到CSS选择器起作用,使选中的标签或元素产生特定的效果. CSS伪类的语法就是: 选择器 : 伪类名 { 属性 : 属性值 } 用的最多的伪类就是超链接a的伪类,有: ...

  8. 常用的SSH注解标签

    常用的SSH注解标签 1.Spring的注解 关于配Bean用的        @Component        @Controller @Service @Repository        作用 ...

  9. HTML5新标签和CSS伪类

    HTML5提供了很多新的标签,由于HTML5的兼容性比较差,HTML5的标签常用于手机端 <nav> <footer> <section> <header&g ...

随机推荐

  1. vuecli3取消eslint

    1.之前好好的项目,今天运行npm run serve.忽然报错运行不了了. 2.原因 在生成项目时候没有忽略 ESlint选项配置,其实建议创建项目的时候还是忽略掉这个选项比较好,因为后期写项目多空 ...

  2. JavaScript远程调用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Eclipse Git插件切换分支的时候不要Reset

    今天做了一件蠢事,我在当前分支上改了很多代码,后来切换分支的时候,有一个文件有冲突,eclipse提示这个文件冲突,我可以选择commit/stash/reset,我一看这个文件没什么关系,不需要提交 ...

  4. 存储过程详解 -SQLServer

    来源:http://www.cnblogs.com/knowledgesea/archive/2013/01/02/2841588.html 存储过程简介 什么是存储过程:存储过程可以说是一个记录集吧 ...

  5. MVVMDemo

    QueryCommand.cs using System;using System.Collections.Generic;using System.Linq;using System.Text;us ...

  6. 【水滴石穿】react-native-app

    项目地址:https://github.com/WQone/react-native-app 这个是一个非常优秀的小姐姐写的,希望大家能够以她为榜样,一起加油进步呀- 先看效果 分析package.j ...

  7. 推荐一个好用的git图形化工具

    之前一直用的是SmartGit,虽然贼好用,但是是收费的. 现在看到了一款免费也非常炫酷的工具,忍不住强烈推荐一下GitKraken rebase,cherry pick啥的用挺好用

  8. 【JZOJ4814】【NOIP2016提高A组五校联考2】tree

    题目描述 给一棵n 个结点的有根树,结点由1 到n 标号,根结点的标号为1.每个结点上有一个物品,第i 个结点上的物品价值为vi. 你需要从所有结点中选出若干个结点,使得对于任意一个被选中的结点,其到 ...

  9. day39-Spring 08-Spring的AOP：基于AspectJ的注解

    基于AspectJ的注解的开发要重点掌握. 这些表达式肯定要应用在我们的某些个增强上. 学习AspectJ也是两种形式:一种是XML,一种是注解.AspectJ的增强,就是那些通知的类型.Aspect ...

  10. 【风马一族_php】常用的语句

    设置脚本的编码 <?php header('Content-type:text/html;charset=utf-8');  ?> 按原格式的输入内容 echo <pre>; ...