分享好友 最新动态首页 最新动态分类 切换频道
html常用标签1
2024-12-26 03:53

<title>网站的总标题

html常用标签1

1.标题标签  h1~h6

语义:用标题标签包裹的内容就是标题

          标题标签也会帮助seo进行推广,h1到h6,语义是逐步降低的

          h1的语义最重,所以一般情况下,一个页面就用一个h1

          常用的h1-h3

         默认样式:字体会加粗,从h1-h6字体大小是逐步变小,会独占一行

关注语义,而不是样式

2.段落标签<p></p>,段落标签用于表示内容中的一个自然段

       语义:用段落标签进行包括,其内容就表示是一个段落

       默认样式:会独占一行,段落与段落之间有较大的间距

3.hgroup标签<hgroup> </hgroup> 用来为标题分组,可以将一组相关的标题同时放入到hgroup

4.强调标签 

    em标签用于表示语音语调的一个加重, 行内元素(inline element

    strong表示强调,重要内容,强调

    em和strong都不会独占一行

<!-- 面试题:html中有两个强调标签,它们的区别是什么

     样式上:em强调,字体会变斜体

            strong强调,字体会加粗

     语义上:em是语音语调的强调

           strong是具体内容的强调

    在实际的开发过程中,一般不做区分,两个强调标签都可以使用 -->

eg

 

5.center  居中效果

  <center>

      <h1>法巴登整。</h1>

      <p>到憾文韩一得决位孔。</p>

      <p>到憾文韩一得决位孔。</p>

      <p>到憾文韩一得决位孔。</p>

      <p>到憾文韩一得决位孔。</p>

    </center> 

6. q 表示短引用

    默认样式:会在文本外面加双引号

            不会独占一行

<q>他低斯哥处生有书系。</q>

    <q>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Placeat, dolore.</q>

  

7.换行标签  br  强制换行

    <p>

      秦互气为游子的事皇得,<br />

      云不巴仃分投忧娟喜力给也韩战将,<br />

      会当今少,<br />

      他冇生,<br />

      介胜家。<br />

    </p> 

8.分割线   单标签

     <hr />

9.使用del标签来表示一个删除的内容

    在文本的中间会有一根删除线,它也不会独占一行

<del>要与原为色,你定的。</del>

    <p>

      原价:<del>9999</del> <br />

      现价:9.9

    </p>

10.div 用来布局的,没有语义,会独占一行

    <div>

      今晚 教从者,谷为恩,洪。

    </div>

    <div>

      Lorem ipsum dolor sit amet consectetur, adipisicing elit. Illum, blanditiis.

    </div>

11.span  没有任何语义,一般就用来包裹文字

    不会独占一行

    <span>你好</span>

    <span>hello</span>

    面试题: 请你简单说一说元素的分类,并举一些具体例子

     元素(标签)的分类  

        1、形式分

          双标签:h1-h6,p,strong,em,hrgoup,del ,div,span····

          单标签:br,hr,meta····

        2、特点分

          块标签:一般都是用来布局的

            (1)、会独占一行

            (2)、可以设置宽高

            (3)、如果不设置宽高,块元素的宽度是父元素的100%,块元素的高度是被内容撑开

            eg:h1-h6,p,hgroup,center,div

          行内标签:一般用来包裹文字

            (1)、不会独占一行

            (2)、不可以设置宽高,被内容撑开

            eg:strong,em,span,del····

          行内块标签

             (1)、兼具块标签和行内标签的特点,可以设置宽高,不会独占一行

             (2)、元素与元素之间会有3像素的空白间距,称三像素问题

            eg:img,input,button·····

        注意

          1、块标签里面什么都能放

        块标签里面可以放块标签,行内标签,行内块标签

          2、行内标签里面一般只放文字,不能放块标签

          3、有一个特殊的块标签 p标签

            它里面只放文字或图片,不能放块元素

          4、有一个特殊的行内标签 a标签

            它里面什么都能放,除了它自己

html5的新标签

      布局标签(结构化标签) 都是块标签

    header  网页的头部

    main  网页的主体部分(一般就一个

    footer 网页的底部

    nav  网页的导航

    aside  和主体相关的内容,侧边栏

    article  文章之类的

    section 独立的区块,上面的标签都不合适,就用这个  

        用来代替div

 
 

1、什么是实体

        浏览器会提前征用一部分的字符,例如大于号,小于号,空格,版权符号等等。

   如果程序员想用,可以用一些额外的字符去表示,这些额外的字符,我们叫实体

   

 

2、实体的语法

        &实体的名字; 

 3、常用的实体

        大于号:  &gt;

        小于号:  &lt;

        空格:   &nbsp;

        版权符号: &copy;

 列表(list) 一组一组  

            1:有序列表  用ol标签创建,li表示列表项

              默认样式

                列表项的前面有加1,2,3···项目符号

                列表项的前面有较大的间距

            2:无序列表  用ul标签创建,li表示列表项

              默认样式

                列表项的前面有加黑色实心小圆点

                列表项的前面有较大的间距

            3:定义列表  用dl标签创建,使用dd对内容进行解释说明

    注意

          1、常用有序列表和无序列表  而且在实际开发过程中,不需要特别区分有序或者无序

          2、有type属性,可以更改列表项项目符号  

            ol   type属性值:1,a,A,i,I

            ul   type属性值:disc,默认值,实心的圆点

                            square,实心的方块

                            circle,空心的圆

            实际开发过程中,我们会去除默认的项目符号

          3、列表可以相互嵌套   因为列表是块元素

          4、ol  li

            ul  li

            dl  dt dd

            是配合使用,一般情况,不在里面加入其他直接子元素


   

 

最新文章
3D点云分割标注工具,助力AI多领域场景理解
3D点云语义分割是指给点云中的每个点赋予特定的语义标签,也可以说是对每个物体进行分割,赋予每个物体特定的含义。这种技术在自动驾驶、机器人、增强现实(AR)等许多领域有着广泛的应用,是场景理解的关键。 然而,由于3D点云数据具有稀
11款常见的谷歌链接分析工具:功能特点优劣势一览
"内容为王,外链为皇,”网站的成功与否往往取决于其在搜索引擎中的排名和可见性。而链接分析工具成为了现代SEO策略中不可或缺的一环。随着互联网的不断发展,越来越多的企业和个人意识到,要在激烈的竞争中脱
deepface live
deepface live官网,AI直播实时换脸工具,高质量、逼真的人脸换脸效果DeepFaceLive是一个开源的深度学习库,旨在实现高质量、逼真的人脸换脸效果。它基于深度学习技术和计算机视觉算法,能够将一个人的脸部表情和动作自然地转移到另一个人的
15款最好用的腾讯短链接url批量生成工具 - 值得收藏
整理了15款国内最好用的腾讯短链接(url.cn)批量生成工具,拿走不谢!  平台官网:http://qturl.cn青桃短链接是一个老牌的第三方短链接服务平台了。对于其技术支持和服务质量来说,可以说是国内最好
flex布局,rem布局,自适应布局,响应式布局,Bootstrap
1.兼容性好, 2.布局繁琐, 3.局限性,不能再移动端很好的布局1.操作方便,布局极为简单,移动端应用很广泛, 2.PC端浏览器支持情况较差 3.ie11或更低版本,不支持或仅部分支持 注意:当
2014中国游戏风云榜 《枪神纪》荣膺十大新锐网游
2月4日,第十一届“中国游戏风云榜“颁奖盛典在北京饭店金色大厅隆重举行,并颁出了“十大最受欢迎网络游戏”、“十大热门网页游戏”、“十大最受欢迎手机游戏”等十多个奖项,腾讯游戏旗下首款二次元动漫射击网游《枪神纪》则将“十大新
ChatGPT 修得了别人的 Bug,修不了自己的!OpenAI 直指开源数据库 Redis 漏了底
作者 | 屠敏出品 | CSDN(ID:CSDNnews)ChatGPT 的火爆,超出了很多人的想象。今年初,根据 UBS(瑞士银行巨头瑞银集团)的一份报告显示,ChatGPT 推出仅两个月后,它在 2023 年 1
AI工具推荐:开源TTS(文本生成语音)模型集合
XTTS TTS是一个语音生成模型,可以通过一个简短的6秒音频片段将声音克隆到不同的语言。它不需要大量的训练数据,也不需要耗费大量时间。TTS支持17种语言,可以进行声音克隆、情感和风格转移、跨语言声音克隆以及多语言语
AI赋能办公,10秒生成PPT,海量模板任你挑选
### AI赋能办公:10秒生成PPT,海量模板任你挑选在信息化、智能化的今天,人工智能(AI)技术正以前所未有的速度渗透到各行各业,而办公领域无疑是其中的重灾区AI技术的应用不仅极大地提高了工作效率,还为员工提供了更为便捷、个性化的办
# 小程序协同工作和发布
在中大型的公司里,人员的分工非常仔细,一般会有不同岗位角色的员工同时参与同一个小程序项目。为此,小程序平台设计了不同的权限管理使得项目管理者可以更加高效管理整个团队的协同工作。 以往我们在开发完网页之后,需要把网页的代码和
相关文章
推荐文章
发表评论
0评