Html基础知识2

最新推荐文章于 2024-07-17 09:43:10 发布
最新推荐文章于 2024-07-17 09:43:10 发布
阅读量24 收藏
点赞数
文章标签： html css 前端 css3 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/bsf000000___/article/details/131888731
版权

文章目录

Html基础知识2

1 基本选择器

<div class="example">这是一个示例</div>
<p id="myElement">这是我的元素</p>
<a href="https://example.com" target="_blank">点击我</a>
<ul>
  <li>列表项1</li>
  <li>列表项2</li>
</ul>
<h2>标题</h2>
<p>段落1</p>
<p>段落2</p>


/* 元素选择器 */
p {
  color: blue;
}

/* 类选择器 */
.example {
  font-weight: bold;
}

/* ID选择器 */
#myElement {
  text-decoration: underline;
}

/* 属性选择器 */
a[href] {
  color: red;
}

/* 后代选择器 */
div p {
  font-style: italic;
}

/* 子选择器 */
ul > li {
  list-style-type: circle;
}

/* 相邻兄弟选择器 */
h2 + p {
  font-size: 20px;
}

在上面的示例中，我们使用了不同的基本选择器来选择和样式化不同的元素。例如：

  • p 元素选择器选择所有 <p> 元素并将其文本颜色设置为蓝色。
  • .example 类选择器选择具有 class="example" 的元素，并设置字体加粗。
  • #myElement ID选择器选择具有 id="myElement" 的元素，并添加下划线文本装饰。
  • a[href] 属性选择器选择具有 href 属性的 <a> 元素，并将其文本颜色设置为红色。
  • div p 后代选择器选择所有 <p> 元素，但只有在它们是 <div> 元素的后代时才适用，并设置斜体样式。
  • ul > li 子选择器选择所有 <li> 元素，但只有在它们是 <ul> 元素的直接子元素时才适用，并添加圆圈列表样式。
  • h2 + p 相邻兄弟选择器选择紧接在 <h2> 元素后的 <p> 元素，并将字体大小设置为20像素。

2 CSS三大机制(重点)

2.1 CSS样式来源

CSS中的样式一共有三种来源：创作人员、读者和用户代理

  • 创作人员：即代码编写者

  • 用户代理样式：即浏览器

  • 读者样式：即浏览网页的用户

  • 权重排序：创作人员的样式 > 读者人员的样式 > 用户代理的默认样式

2.2 CSS三大机制

CSS的三大机制是：特殊性[冲突]、继承、层叠。

3 文本

3.1文本颜色

color 属性用于设置文本的颜色。颜色由以下值指定：

  • 颜色名 - 比如 red
  • 十六进制值 - 比如 #ff0000
  • RGB 值 - 比如 rgb(255, 0, 0) 里面三个值分别代表红色、绿色、蓝色的强度

3.2 文本对齐

3.2.1 水平对齐

text-align 是CSS属性，用于指定文本在其容器盒子中的水平对齐方式。

常见的取值包括：

  1. left：将文本左对齐。
  2. right：将文本右对齐。
  3. center：将文本居中对齐。
  4. justify：将文本两端对齐，通过调整单词和字母间的间隔来实现。
  5. start：根据语言的书写方向，将文本左对齐或右对齐。
  6. end：根据语言的书写方向，将文本右对齐或左对齐。

这些取值可以应用于块级元素（如 <div>、<p>）或内联元素（如 <span>、<a>）。注意，text-align 属性仅影响文本内容而非文本本身所占据的空间。

下面是一个例子，展示了如何使用 text-align 属性：

.container {
  width: 300px;
  height: 200px;
  border: 1px solid black;
}

.left-align {
  text-align: left;
}

.center-align {
  text-align: center;
}

.right-align {
  text-align: right;
}

<div class="container">
  <p class="left-align">左对齐文本</p>
  <p class="center-align">居中对齐文本</p>
  <p class="right-align">右对齐文本</p>
</div>

在上述示例中，我们创建了一个名为 .container 的容器，并定义了其宽度、高度和边框样式。在容器内部，使用了三个 <p> 元素，并分别给它们应用了不同的对齐方式。

通过为每个 <p> 元素添加相应的类名，可以实现文本内容在容器中按不同方式对齐。当我们设置 text-align: left; 时，文本向左对齐；当设置 text-align: center; 时，文本居中对齐；当设置 text-align: right; 时，文本向右对齐。

3.2.2垂直对齐

vertical-align 是CSS属性，用于指定行内元素或表格单元格中内容的垂直对齐方式。

它可以应用于行内元素（如 <span>、<img>）或表格单元格（如 <td>）。然而，要注意的是，vertical-align 属性在块级元素上并不起作用。

vertical-align 可以接受以下取值：

  1. baseline：将元素与相邻元素的基线对齐。默认取值。
  2. top：将元素与行的顶部对齐。
  3. middle：将元素垂直居中对齐。
  4. bottom：将元素与行的底部对齐。
  5. text-top：将元素与父元素的文本顶部对齐。
  6. text-bottom：将元素与父元素的文本底部对齐。

下面是一个例子，展示了如何使用 vertical-align 属性：

.container {
  height: 200px;
  border: 1px solid black;
}

.inline-element {
  display: inline-block;
  vertical-align: middle;
}

<div class="container">
  <span class="inline-element">垂直居中</span>
  <span class="inline-element">垂直居中</span>
</div>

在上述示例中，我们创建了一个名为 .container 的容器，并定义了其高度和边框样式。在容器内部，使用了两个 <span> 元素，并给它们应用了相同的类名。

通过将这些 <span> 元素的 display 属性设置为 inline-block，我们使它们变成行内块元素，从而能够应用垂直对齐属性。

通过设置 vertical-align: middle;，我们将这些行内块元素垂直居中对齐于其父容器内。这样，它们就会与容器的高度居中对齐。

3.3 文本装饰

text-decoration 是CSS属性，用于向文本添加装饰效果，例如下划线、删除线、上划线等。

text-decoration 可以应用于任何文本内容，包括段落、标题、链接等。它可以接受以下取值：

  1. none：没有任何装饰效果。默认取值。
  2. underline：给文本添加下划线。
  3. overline：给文本添加上划线。
  4. line-through：给文本添加删除线。
  5. underline overline：同时添加上划线和下划线。
  6. underline line-through：同时添加下划线和删除线。
  7. overline line-through：同时添加上划线和删除线。
  8. inherit：继承父元素的 text-decoration 值。

下面是一个例子，展示了如何使用 text-decoration 属性：

a {
  text-decoration: underline;
}

p.strikethrough {
  text-decoration: line-through;
}

span.double-line {
  text-decoration: underline overline;
}

<a href="#">带下划线的链接</a>

<p>这是一个普通的段落。</p>

<p class="strikethrough">这是一个添加删除线的段落。</p>

<span class="double-line">这是一个同时添加上划线和下划线的文本。</span>

3.4 文本缩进

text-indent 是CSS属性，用于指定文本块的首行缩进。

使用 text-indent 属性可以将文本块的第一行（通常是段落的第一行）向右缩进一个指定的长度或百分比。

text-indent 可以接受以下取值：

  1. 长度值：使用像素（px）、英寸（in）、厘米（cm）等单位来指定缩进的长度。例如 text-indent: 20px; 将首行缩进 20 像素。
  2. 百分比值：使用父元素宽度的百分比来指定缩进的长度。例如 text-indent: 50%; 将首行缩进为父元素宽度的一半。
  3. inherit：继承父元素的 text-indent 值。

下面是一个例子，展示了如何使用 text-indent 属性：

<style>
    cssCopy Codep {
  text-indent: 2em;
}

blockquote {
  text-indent: 30px;
}
</style>

<p>这是一个带有首行缩进的段落。这是一个带有首行缩进的段落。这是一个带有首行缩进的段落。这是一个带有首行缩进的段落。</p>

<blockquote>
  这是一个带有更大缩进的引用块。这是一个带有更大缩进的引用块。这是一个带有更大缩进的引用块。
</blockquote>

3.5 字符间距

letter-spacing 是CSS属性，用于控制文本中字符之间的间距。

使用 letter-spacing 属性可以增加或减少字符之间的间距，从而改变文本的显示效果。

letter-spacing 可以接受以下取值：

  1. 长度值：使用像素（px）、英寸（in）、厘米（cm）等单位来指定字符间距的大小。例如 letter-spacing: 2px; 将字符间距增加 2 像素。
  2. 百分比值：使用当前字体大小的百分比值来指定字符间距的大小。例如 letter-spacing: 50%; 将字符间距设置为当前字体大小的一半。
  3. 正负值：也可以使用正负值来控制字符间距的增加或减少。正值增加间距，负值减小间距。例如 letter-spacing: -1px; 将字符间距减小 1 像素。
  4. normal：恢复默认的字符间距。通常与继承的字体样式一起使用。

下面是一个例子，展示了如何使用 letter-spacing 属性：

h1 {
  letter-spacing: 2px;
}

p {
  letter-spacing: -0.5em;
}

<h1>这是一个标题</h1>

<p>这是一个带有调整字符间距的段落。这是一个带有调整字符间距的段落。这是一个带有调整字符间距的段落。</p>

！！！！！！！！

  • 需要注意的是，letter-spacing 只会影响到文本中字符之间的间距，而不会影响到单词之间的间距。如果你想调整单词之间的间距，你可能需要结合其他方式，如使用 word-spacing 属性。

3.6 文本阴影

text-shadow 是CSS属性，用于在文本周围创建阴影效果。

使用 text-shadow 属性可以为文本添加一个或多个阴影效果，使文本在页面上更加突出或具有艺术感。

text-shadow 的语法如下：

cssCopy Codetext-shadow: h-shadow v-shadow blur-radius color;

其中各个值的含义如下：

  • h-shadow：水平阴影的位置，可以是正值（向右移动）或负值（向左移动）。
  • v-shadow：垂直阴影的位置，可以是正值（向下移动）或负值（向上移动）。
  • blur-radius：模糊半径，可以是正值，表示阴影的模糊程度。
  • color：阴影的颜色，可以使用颜色值（如十六进制、RGB、RGBA）或预定义的颜色名称。

下面是一个例子，展示了如何使用 text-shadow 属性：

h1 {
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

p {
  text-shadow: -1px -1px 1px #888888, 1px 1px 1px #ffffff;
}


<h1>这是一个标题</h1>

<p>这是一个带有阴影效果的段落。这是一个带有阴影效果的段落。</p>

4 字体

4.1字体样式

font-style 是CSS属性，用于设置文本的字体样式。

使用 font-style 属性可以控制文本的显示样式，如斜体、正常（默认值）或倾斜。

  • normal：默认值，文本以正常样式显示。
  • italic：文本以斜体样式显示，如果字体本身不支持斜体，则会尝试使用倾斜样式代替。
  • oblique：文本以倾斜样式显示，不管字体是否支持斜体。

下面是一个例子，展示了如何使用 font-style 属性：

h1 {
  font-style: italic;
}

p {
  font-style: oblique;
}

<h1>这是一个斜体标题</h1>

<p>这是一个倾斜段落。</p>

4.2 字体大小

font-size 是CSS属性，用于设置文本的字体大小。

使用 font-size 属性可以控制文本的字体大小，以像素（px）、百分比（%）或其他单位来指定。

font-size 的语法如下：

font-size: value;

其中 value 可以是以下单位之一：

  • 像素（px）：例如 12px 表示字体大小为 12 像素。
  • 百分比（%）：例如 120% 表示相对于父元素字体大小的 120%。
  • em：相对于当前元素字体大小的倍数。例如 1.5em 表示字体大小为当前元素字体大小的 1.5 倍。
  • rem：相对于根元素（通常是 <html> 元素）字体大小的倍数。例如 1.2rem 表示字体大小为根元素字体大小的 1.2 倍。
  • vw、vh：相对于视窗宽度和高度的百分比。例如 10vw 表示相对于视窗宽度的 10%。

5 盒子模型

5.1 BFC——块级格式化上下文

5.1.1 概念

直译为 块级格式化上下文 ，把BFC理解成一块独立的渲染区域，BFC看成是元素的一种属性， 当元素拥有了BFC属性后，这个元 素就可以看做成隔离了的独立容器。容器内的元素不会影响容器外的元素。

简单理解为：将BFC看成是一种属性，当拥有该属性的元素就相当于一块独立的区域。

5.1.2 实现BFC属性的方法
  1. 浮动元素，float 除 none 以外的值
  2. 定位元素，position的值不是static或者relative。
  3. display 为 inline-block 、table-cell、table-caption、table、table-row、table-row-group、 table-header-group、table-footer-group、inline-table、flow-root、flex或 inline-flex、grid或 inlinegrid
  4. overflow 除了 visible 以外的值（hidden，auto，scroll）
  5. 根元素`` 就是一个 BFC
5.1.3 BFC的作用

1、避免外边距重叠（防止margin塌陷）

margin塌陷的意思：同时给两个div设置相同的属性，当设置margin为100px，那么两个div之间的间隙应该是margin-bottom+margin-top=200px的外边距，但是没有设置BFC属性，块的上外边距和下外边距会合并为单个边距，取最大值，如果 margin相等，则仅为一个，这就是外边距重叠（margin塌陷）。

没有设置BFC时两个div之间的外边距

在这里插入图片描述

通过给其中一个div包裹一个父div，设置BFC属性，来解决margin塌陷的问题

<style>
    /* 通过设置overflow:hidden属性，将父容器设置为BFC属性 */
    .container {
    	overflow: hidden;
    }
    .cube {
        width: 100px;
        height: 100px;
        background-color: blueviolet;
        margin: 100px;
    }
</style>
</head>
<body>
<!-- 外边距重叠 -->
    <div class="container">
     	<div class="cube"></div>
    </div>
	<div class="cube"></div>
</body>

运行结果

在这里插入图片描述

2、用于清除浮动

当给一个父元素设置边框，内部元素会将父元素撑起来，但是如果内部元素设置了 float属性，则该父元素会失去支撑，从而没有 高度。

设置了浮动属性的子元素，父元素失去支撑

在这里插入图片描述

通过给父元素设置BFC属性，来实现清除浮动

<style>
    /* overflow: hidden;设置该属性，将父元素设置了BFC属性，即实现了清除浮动 */
    .parent {
        border: 10px solid darkorange;
        overflow: hidden;		
    }
    .child {
        width: 100px;
        height: 100px;
        background-color: rgb(63, 190, 80);
        float: left;
    }
</style>
</head>
<body>
    <div class="parent">
    	<div class="child"></div>
    </div>
</body>

运行结果：
在这里插入图片描述
3、阻止元素被浮动元素覆盖

当前一个兄弟元素设置了浮动属性时，后一个兄弟元素会跑到前一个兄弟元素的位置去，从而后一个兄弟元素被覆盖。 第二个兄弟元素被覆盖的情况。
在这里插入图片描述

通过给被影响的兄弟元素设置BFC属性，来解决被覆盖的情况

<style>
    .cube1 {
        width: 100px;
        height: 100px;
        background-color: darkorange;
        float: left;
    }
/* 通过给被影响元素设置overflow: hidden;属性，将其设置BFC属性，实现阻止被浮动元素影响 */
.cube2 {
width: 200px;
height: 200px;
background-color: darkgrey;
overflow: hidden;
}
</style>
</head>
<body>
<div class="cube1"></div>
<div class="cube2"></div>
</body>

运行效果
在这里插入图片描述

5.2 解决外边距塌陷

满足以下条件就会产生外边距塌陷现象：

  1. 子元素在父元素里面
  2. 子元素中有margin-top或者margin-bottom值

解决方案：

第一种：给父元素增加内边距padding值

第二种方式：父元素增加边框border值

第三种方式：父元素增加overflow：hidden

第四种方式：给父元素或者子元素增加浮动，让其脱离标准流都可以

第五种：将父元素转变为行内块元素，display：inline-block

第六种：给父元素或者子元素定位都可以，原理同样是使其脱离标准流，不过只能用绝对定位和固定定位

第七种：给父盒子增加flex或者inline-flex

6 定位

在网页布局中，CSS 定位（positioning）可用于控制元素的位置。常用的定位属性包括：

  • static（默认）：元素按照正常的文档流进行定位，不受定位属性的影响。
  • relative：相对定位使得元素相对于其正常位置进行偏移，但仍保留其原有空间。
  • absolute：绝对定位使得元素相对于其最近的已定位祖先（非 static 定位的父级元素）进行定位，如果没有已定位的祖先，则相对于文档的根元素进行定位。
  • fixed：固定定位使得元素相对于浏览器窗口进行定位，即无论页面滚动与否，元素始终保持在相同的位置。
  • sticky：粘性定位是相对于其正常位置和滚动容器进行定位的一种混合模式，当元素滚动到特定位置时，会“粘”在容器中的指定位置。
  1. static（默认）：
.static-element {
  position: static;
}

在这种情况下，该元素将按照正常的文档流进行布局，并不受定位属性的影响。

  1. relative：
.relative-element {
  position: relative;
  top: 20px;
  left: 50px;
}

通过将元素的定位属性设置为 relative，并使用 top 和 left 属性来相对于其正常位置进行偏移。在上述示例中，元素将向下偏移20像素，向右偏移50像素。

  1. absolute：
.absolute-element {
  position: absolute;
  top: 0;
  right: 0;
}

将元素的定位属性设置为 absolute ，并指定相对于最近的非 static 定位祖先进行定位。在上述示例中，元素将根据视口的右上角进行定位。

  1. fixed：
.fixed-element {
  position: fixed;
  bottom: 20px;
  right: 20px;
}

通过将元素的定位属性设置为 fixed，元素将相对于浏览器窗口进行定位而不会随页面滚动而改变位置。在上述示例中，元素将固定在窗口的右下角。

  1. sticky：
.sticky-element {
  position: sticky;
  top: 20px;
}

将元素的定位属性设置为 sticky，元素将在滚动容器中“粘性地”定位。在上述示例中，当该元素滚动到距离顶部20像素的位置时，它将固定在容器中的这个位置。

7 背景图

7.1 背景图重复

当设置背景图像时，可以使用以下 CSS 属性来控制背景图像的重复和水平重复：

  1. background-repeat：用于控制背景图像的重复方式，可选值包括：
    • repeat（默认值）：图像在水平和垂直方向上都进行平铺重复。
    • repeat-x：图像仅在水平方向上进行平铺重复。
    • repeat-y：图像仅在垂直方向上进行平铺重复。
    • no-repeat：图像不进行重复。
  2. background-position：用于控制背景图像的水平位置，可以用关键字或具体的数值表示。常用的关键字有：
    • left：将图像置于容器的左侧。
    • center：将图像置于容器的水平居中位置。
    • right：将图像置于容器的右侧。

下面是一个示例，展示如何设置背景图像的重复和水平位置：

.background-image {
  background-image: url('image.jpg');
  background-repeat: no-repeat;
  background-position: right center;
}

在上述示例中，.background-image 的背景图像设置为 url('image.jpg')。通过 background-repeat 属性设置为 no-repeat，背景图像将不进行重复。通过 background-position 属性设置为 right center，背景图像将位于容器的右侧并水平居中。

7.2 精灵图

.sprite {
  background-image: url('sprites.png');
  background-repeat: no-repeat;
}

.icon-home {
  background-position: 0 0; /* 根据精灵图中的位置调整 */
  width: 20px;
  height: 20px;
}

.icon-search {
  background-position: -30px 0; /* 根据精灵图中的位置调整 */
  width: 20px;
  height: 20px;
}

在 HTML 中使用精灵图：通过在 HTML 元素中添加相应的 CSS 类来显示特定的图像。例如：
<div class="sprite icon-home"></div>
<div class="sprite icon-search"></div>

上述示例中，.sprite 类设置了背景图像为 sprites.png，并指定了不进行重复。.icon-home 类和 .icon-search 类分别表示合并图像中的特定图标，并通过调整 background-position、width 和 height 来显示所需的图标。
ht center`，背景图像将位于容器的右侧并水平居中。

7.2 精灵图

.sprite {
  background-image: url('sprites.png');
  background-repeat: no-repeat;
}

.icon-home {
  background-position: 0 0; /* 根据精灵图中的位置调整 */
  width: 20px;
  height: 20px;
}

.icon-search {
  background-position: -30px 0; /* 根据精灵图中的位置调整 */
  width: 20px;
  height: 20px;
}

在 HTML 中使用精灵图：通过在 HTML 元素中添加相应的 CSS 类来显示特定的图像。例如：
<div class="sprite icon-home"></div>
<div class="sprite icon-search"></div>

上述示例中，.sprite 类设置了背景图像为 sprites.png，并指定了不进行重复。.icon-home 类和 .icon-search 类分别表示合并图像中的特定图标，并通过调整 background-position、width 和 height 来显示所需的图标。

bsf000000___
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
HTML基础知识2
09-17
这个“HTML基础知识2”压缩包很可能是包含了一些关于HTML学习的基本资料，面向初学者提供指导。 HTML由一系列元素组成，这些元素定义了网页的结构和内容。每个元素由开始标签和结束标签构成，例如`<p>`和`</p>`用于...
Html基础知识点.docx
07-23
Html 基础知识点 Html 是一种标记语言，用于创建网页的结构和内容。以下是 Html 基础知识点： 一、Html5 文档类型和字符集 * Html5 文档类型：<!doctype html> * Html5 字符集： 二、Html5 Canvas 元素 * ...
HTML基础知识总结
qq_40046544的博客
11-14 3804
HTML 是用来描述网页地一种语言。HTML 指的是超文本标记语言（Hyper Text Markup Language）HTML 不是一种编程语言，而是一种标记语言（markup language）标记语言是一套标记标签（markup tag）HTML 使用标记标签来描述网页声明必须是 HTML 文档的第一行，位于 html 标签之前。声明不是 HTML 标签；它是指示 web 浏览器使用哪个 HTML 版本进行编写的指令。
HTML基础知识点
qq_40046544的博客
07-27 8560
网页是一个包含HTML标签的纯文本文件，它可以存放在世界某个角落的某一台计算机中，是万维网中的一页，是超文本标记语言格式。它通常是由图片、文字、链接、声音、视频等元素组成。通过网页浏览器访问。HTML指的是超文本标记语言（HyperTextMarkupLanguage），它是用来描述网页的一种语言。web标准也成为网页标准，它是由一系列标准组成，这些标准大部分由W3C负责定制，也有一些标准由其他标准组织制定。绝对路径指目录下的绝对位置，可以直接到达目标位置，通常从盘符开始的路径。例如D从。...
HTML5基础知识
qq_46485137的博客
02-13 4551
一、初识HTML HTML：Hyper Text Markup Language（超文本标记语言） 超文本包括：文字、图片、音频、视频、动画等 HTML5的优势： 跨平台、 W3C标准 World Wide Web Consortium（万维网联盟） 成立于1994年，Web及时领域最权威和具影响力的国际中立性技术标准机...
HTML基础知识点大全
m0_69674158的博客
05-04 6835
一、什么是HTML HyperText Markup Language，即超文本标记语言 二、第一个HTML <！doctpye html> <html> <head></head> <body></body> <html> 三、常用的标签🀄️🀄️🀄️ 1⃣️p 标签 ，段落标签，占整行 2⃣️img 图片标签： ①src 图片路径：绝对路径http://xxx.xx/xx/x.jpg 相对路径..
HTML基础知识
xuan971130的博客
03-02 2883
一、基础知识： 1.网站：许多网页的集合。 2.HTML：超文本标记语言（Hyper Text Markup Language），用来描述网页的一种语言。不是一种变编程语言，而是一种标记语言。 3.浏览器内核（渲染引擎）：负责读取网页内容，整理讯息、计算网页的显示方式并显示页面。 4.Web标准的组成 ...
前端-HTML基础知识详解
qq_52262831的博客
12-23 4880
目录： 初始常用的HTML标签 资源路径 列表标签 表格标签 表单标签 表单提交
HTML5 基础知识总结(全)
IT_Holmes的博客
04-22 7272
HTML 一1.文档类型2.字符集3.标签< h1 >到< h6 >4.文本格式化标签（熟记）5.标签属性6.图像标签img 学习HTML推荐使用Sublime Text软件来操作练习，一定要熟练使用这个软件，对以后的无论是工作还是学习都有很大帮助。 1.文档类型<!DOCTYPE> <!DOCTYPE html> 这句活就是告诉我们使用那个html版本。 只需要记住，看到上面这行代码，说明使用的是html5的版本。 2.字符集 <meta chars
Vue2-基础知识
热门推荐
qq_54379580的博客
09-28 1万+
一些vue的基础知识啦, 基本用法, 指令相关,侦听器,过滤器,计算属性, 组件相关, 路由相关的基础知识点啦~~~
Html基础知识点整理
m0_53157173的博客
06-15 1909
Html基础知识点整理基本标签字体标签格式化标签1. < br/ >2. < p > < /p >3. < h1 > < /h1 >4. & nbspHtml的注释图片标签1. < img/ >列表标签1. < ul > < /ul >2. < li > < /li >3. < ol > < /ol >超链接标签< a > < /a &
web前端基础知识
qq_43375584的博客
02-28 6198
HTML&CSS基础经典版 HTML：结构（页面元素和内容） css：表现（网页元素的外观和位置等页面样式） 行为：JavaScript：行为（网页模型定义与页面交互） 排版标签 排版标签标题标签：h系列标签 重要程度依次递减 特点：独占一行、h1-h6文字逐渐减小 段落标签：p 特点：段落之间存在间隙、独占一行 换行标签： 水平分割线： 文本格式化标签 场景：让文字加粗b strong、下划线u ins、倾斜i em、删除线s del等 语义：突出重要
html基础知识
12-04
html基础知识html基础知识html基础知识html基础知识html基础知识
HTML基础知识讲解！
03-26
HTML 基础知识讲解 HTML 基础知识是网页开发的基础，了解 HTML 基础知识是学习网页开发的必备条件。本文将详细讲解 HTML 基础知识，包括 HTML 标题、HTML 段落、HTML 链接和 HTML 图像等。 HTML 标题 -------- ...
HTML2048小游戏（最新版）
最新发布
w11111xxxl的博客
07-17 407
比上一篇文章的2048小游戏更好一点。
高频面试题-HTML
CSDN20221005的博客
07-15 907
离线存储是基于 .appcache ⽂件的缓存机制(不是存储技术)实现的，通过这个⽂件上的解析清单离线存储资源，这些资源就会像 cookie ⼀样被存储了下 来。块级元素有： div p 列表标签(ul ol li dl dt dd) 标题标签(h1 h2 h3 h4) 表格标签(table)空元素： <br> <hr> <img> <input> <link> <meta>->新增了语义化标签(header/footer/nav/asid)->新增了表单增强控件(data/time/email/url)
HTML-VUE页面调用android 客户端网络请求并返回数据
weixin_42504805的博客
07-15 201
确保WebView的设置允许JavaScript接口，并且WebView加载的页面有权限调用这些接口。这样，当用户在Vue页面中点击按钮时，会通过WebView调用Android客户端的网络请求方法，然后将结果回调到Vue页面中显示。在Html-- Vue页面调用Android客户端网络请求并返回数据，通常需要通过WebView与Android客户端的JavaScript接口进行交互。2.在WebView中设置该接口。
JavaWeb---HTML
mmmmazhiyuan的博客
07-14 799
HTML是Hyper Text Markup Language的缩写。意思是超文本标记语言。它的作用是搭建网页结构，在网页上展示内容HTML5 是HyperText Markup Language 5 的缩写，HTML5技术结合了 HTML4.01 的相关标准并革新，符合现代网络发展要求，在 2008 年正式发布。HTML5 由不同的技术构成，其在互联网中得到了非常广泛的应用，提供更多增强网络应用的标准机。与传统的技术相比，HTML5 的语法特征更加明显，并且结合了SVG的内容。
HTML基础知识：表单功能解析
"本章主要介绍了HTML基础知识，包括HTML简介、标记语法、文档结构、段落和列表标记、图片和表格处理、超链接、表单功能以及如何插入多媒体元素和使用构架与嵌入框。内容详尽地阐述了HTML作为标记语言在网页设计中的...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值