网页的基本骨架、排版标签

198 阅读1分钟

基础认识

web标准

  • 结构---html
  • 表现---css
  • 行为---javaScript

网页基本骨架

<!-- 网页的整体-->
<html>
    <!-- 网页的头部-->
    <head>
        <title>网页的标题</title>
    </head>
<body>
​
网页的主题(身体)
​
</body></html>

标签的构成

标签分为单标签和双标签

注释快捷键:ctrl+/
​
单标签:
    换行 <br> 
    水平线 <hr>
双标签:
    <p>段落标签</p> 
    <div>盒子标签</div>

排版标签

标题标签

<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>

h6到h1文字依次加大加粗

标题只有六级

换行标签 水平线标签

<br> 强制换行
<hr> 水平线

段落标签

<p>中国共产党成立一百年了,我们这个党能够发展壮大起来不容易,夺取政权不容易,建设新中国不容易。为什么老百姓衷心拥护中国共产党?因为我们党始终全心全意为人民服务、为各民族谋幸福。</p>

独占一行

文字一行装不下会自动换行

段落与段落之间存在垂直间隙

图片标签

<img src="./img/dehua.jpg" art="图片找不到了!" title="刘德华">

src:图片的路径

alt:替换文本(图片无法加载显示的文本信息)

title:提示文本(鼠标悬停时显示的文本信息)

src属性是必写属性

文本格式化标签

    <!--加粗-->
    <b>加粗</b>的文字<br>
    <strong>加粗</strong>的文字<br>
​
    <!--下划线-->
    <u>下划线</u><br>
    <ins>下划线</ins><br>
​
    <!--倾斜-->
    <i>倾斜的文字</i><br>
    <em>倾斜的文字</em><br>
​
    <!--删除线-->
    <s>删除线</s><br>
    <del>删除线</del>

单词更长的标签语义更强烈,推荐使用

重点掌握 strong em