编程学习
📄 HTML学习(2)id与class
00 分钟
2023-4-12
2023-11-23
type
status
date
slug
summary
tags
category
icon
password
Email

HTML类

使用 <div>来进行给文章的分类,然后我们就可以为文章的类定义css样式,为相同的类设置相同的样式,或者为不同的类设置不同的样式。
如下所示:我们为下面的文章的几块定义了 <div>属性,则表示他们属于类,并且都属于 cities一类,所以我们便可以在<head>中统一设置 他们的类样式,如.cities所示
使用<span>来定义行内的类,设置此属性,能够为某一行的内容设置样式。

HTML id属性

id用于为html指定唯一的id属性。id在html中是唯一的,id属性用于为特定样式表进行样式的设置。
注意id的写法:前面是一个#号,后面跟的是id名称,然后再花括号中定义css属性
然后再具有id的标签元素中,我们便可以改变他为指定的样式
id对大小写敏感!
id至少包含一个字符,并且不能包含空格

class与id的区别:同一个class可以由多个HTML元素使用,但是一个id只能被页面的唯一一个HTML元素使用

使用id来进行跳转,类似于书签的跳转
也可以跳转到另一个界面

在 JavaScript 中使用 id 属性

HTML内联框架

使用<iframe>在网页内创建网页:
height和width属性来指定显示的网页的宽度和高度,frameborder来隐藏边框
我们的内联框架是 google.com,然后我们为其设置了一个name,之后在<a>标签中我们又指定了网页跳转的target,因此最终我们的网站将会在内联框架中显示

HTML Javascript

我的第一段JavaScript

点击显示时间

<script>标签用来定义客户端脚本,即可以包含脚本语句,也可以通过src属性指向外部脚本文件。
🐀🐂🐅🐇🐉🐍🐎🐏🐒🐥🐕🐖

JavaScript的简单介绍:

HTML文件路径

文件的相对路径:
相对路径
内容
"picture/images.png"
同一级文件夹下的picture文件夹的images.png图片
"images.png"
当前文件夹下的images.png图片
"/picture/images.png"
根目录下的pciture文件夹下的images.png图片
"../images.png"
上一级文件夹下的images.png图片
使用相对路径是个好习惯。

HTML头部

<head>是所有头部元素的容器,可以将以下标签添加到<head>中:<title>、<base>、<link>、<meta>、<script> 以及 <style>。
<title>标签:定义文档的标题。
<base>标签:指定链接的基地址与其他属性,在下面我们需要用到的时候直接使用相对路径即可
<link>:通过外部样式表进行格式化
<style>:规定标签元素的样式:为网页主题设置颜色
<meta>:提供页面的信息。提供页面的元数据,但是这些数据对于用户是不可见的,但是对于机器是可见的。
常被用于规定页面的描述,关键词,作者,最后修改时间与其他数据。
下面规定了页面的描述与页面关键字
name 和 content 属性的作用是描述页面的内容。
<script>:定义客户端的脚本。

 

评论
  • Twikoo
  • Valine