a标签里面设置onclick_HTML学习笔记:各种常用标签
今天是刘小爱自学Java的第76天。
感谢你的观看,谢谢你。
话不多说,继续html的学习:
昨天学习了最基础的文本标签及属性,除此之外还有很多其它标签,今天逐一学习。
一、链接标签(a标签)
a标签有一个必不可少的属性:href。href也就是超链接的意思。
下面编写代码,其中我每行之间用了两个换行符(
),为了使页面看起来相对而言更加美观些。
①href="#"
作用是跳转本页面。
②href="对应网页链接地址"
作用是跳转到对应网页。
③href="本地主页"
这个呢是我自己电脑里面的一个html文件,自己可以访问,但是别人就没法访问了。
②中的是只要网址能打开,所有人都能访问。
④href="mailto:对应邮箱地址"
作用是用本地的邮箱客户端,给填写的邮箱发送邮件。
⑤target="_self"
self,自身的意思,作用就是在当前页面中打开填入的网页链接。
⑥target="_blank"
blank,空白的意思,作用就是在新窗口中打开填入的网页链接。
⑦
title,又是标题,这里的作用是:当我们将鼠标放在当前链接上的时候会出现一个标题提示。
代码编写完毕,做一个测试:
其中有个小常识:
左键直接点击,会在当前页面中打开对应链接。
Ctrl+左键点击,会在新的页面中打开对应链接。
二、图片标签和列表标签
1图片标签
image,图像的意思,简写为img,图片标签也就是用img来表示。
①src="图片地址"
如果是本地图片,写出图片所在的路径即可。
如果是网络图片,写出其对应的链接即可。
其中width为宽度,height为高度,如果只设置其中一项,高度和宽度是等比例缩放的。
当然也可以宽度高度同时设置不同的值。
②
如果图片丢失了,就会显示alt里面的内容。
③
同a标签一样,当鼠标放在该图片上时,会显示title里的内容。
2列表标签
list,即列表的意思,其中又分为有序列表和无序列表。
有序列表:ordered list,简写就是ol。
①type="1"
数字排序,这也是默认的有序排序规则,所以可以省略不写。
②type="a"
使用小写字母排序,详情见上图。
③type="A"
使用大写字母排序,详情见上图。
④type="Ⅰ"
使用罗马字母排序,详情见上图。
⑤type="i"
使用字母i来排序,详情见上图。
无序列表:unordered list,简写就是 ul。
①type="disc"
disc,唱片、圆盘的意思,这是无序列表的默认属性,所以可以省略不写。
②type="circle"
circle,圆形的意思。
③type="square"
square,正方形的意思。
三、表格标签
1基本介绍
table,表格的意思,这在学数据库时就接触过。
tr,tablerow的缩写,表示的是表格中的行。
td,tabledata的缩写,表示的是表格中的数据。
①单元格:cell:细胞的意思,在表格中就表示为一个单元格。
②表格外边框:border,边界的意思,用其可以设置外边框的粗细。
③单元格外间距:cellspacing,用其设定外间距。
④单元格内间距:cellpadding,用其设定内间距。
其中width表示表格的宽度,并且外间距一般都会设定为0,不然都不像是个表格的样子。
①caption标签
标题的意思,用以说明表格的标题,我这边还用了一个b标签将其给加粗了。
②th标签
table head的简写,也就是表格的表头,它是默认居中加粗的。
当然我们也可以根据align属性来设定排序位置(居左,居中,居右)。
此外,其中也可以使用thead、tbody、tfoot标签来划分表格。
- thead表示表格的头部。
- tbody表示表格的主体。
- tfoot表示表格的脚部。
这个稍作了解即可,感觉使用这些标签和不使用这些标签对表格本身没有影响。
2表格快速模板设置
看到左上角那个黄灯后点击,选择Language Injection Settings,最后选择html即可。
这样设置后就可以使用表格快速创建模板了。
先输入table>tr*4>td*4,再加上Tab键,即可快速创建一个4*4的表格。
3合并单元格
①rowspan
合并行的意思,相同的列不同的行。
“2”的意思就是表示是跨两行,从第1行开始将第1行和第2行合并起来了。
既然如此,那么第2行总共也就只需要3列了,所以将其第2行第1列删除。
②colspan
合并列的意思,相同的行不同的列。
“3”的意思就是表示是跨3列,从第2列开始将第2列第3列和第4列合并起来了。
既然如此,那么第3行总共也就只需要2列了,所以将第3行中第3列第4列删除。
最后
谢谢你的观看。
如果可以的话,麻烦帮忙点个赞,谢谢你。
a标签里面设置onclick_HTML学习笔记:各种常用标签相关推荐
- HTML学习笔记_常用标签的使用及注意事项
html学习笔记 本文根据B站pink老师的视频整理而成,包含常用标签的使用及注意事项. 注意:本篇文章排版不好看,不方便大家阅读,重新排版后的文章在这里:HTML学习笔记 | 常用标签的使用及注意事 ...
- vue 循环tabs 标签页 组件_vue学习笔记--v-for循环标签页label并实现根据不同label表格切换...
目标:用标签页组件实现点击不同标签显示表格内容,标签页内lab le 和表格数据都是循环得到的. 效果如图: 2.png 首先 实现pane 循环出header. v-model="tabK ...
- HTML+CSS学习笔记(2) - 认识标签(1)转载
HTML+CSS学习笔记(2) - 认识标签(1) 1.语义化,让你的网页更好的被搜索引擎理解 http://www.cnblogs.com/wanglongshuai/p/5204070.html@ ...
- Java学习笔记-Day43 HTML标签
Java学习笔记-Day43 HTML标签 一.布局标签 1.p标签 2.div标签 3.span标签 二.列表标签 1.有序列表 2.无序列表 3.自定义列表 三.文本标签 1.内联型文本标签 2. ...
- html5表格所有属性,HTML5学习笔记之表格标签
HTML5学习笔记之表格标签 其他HTML5相关文章 一.表格标签 image 1.作用: 以表格形式将数据显示出来, 当数据量非常大的时候, 表格这种展现形式被认为是最为清晰的一种展现形式 2.格式 ...
- CSS学习笔记-04 a标签-导航练习
个人练习,各位大神勿笑 .. <!DOCTYPE html> <html lang="en"> <head><meta charset= ...
- jquery学习笔记及常用函数封装
二.JQuery 学习笔记及常用函数封装 https://download.csdn.net/download/weixin_42530002/13087988 1.JQuery入门 (1).css选 ...
- Python学习笔记:常用第三方模块3
前言 最近在学习深度学习,已经跑出了几个模型,但Pyhton的基础不够扎实,因此,开始补习Python了,大家都推荐廖雪峰的课程,因此,开始了学习,但光学有没有用,还要和大家讨论一下,因此,写下这些帖 ...
- HTML笔记——②HTML常用标签、属性
本系列笔记为nmy专属定制修改 HTML笔记--②HTML常用标签 一 HTML的标签 1.1 标签分类 1.2 HTML5 代码规范 二 HTML常用标签 2.1 标题与段落 2.2 文本修饰标签 ...
最新文章
- linux python3安装包_Linux下安装python3及相关包
- python编写程序的一般步骤-Python编写win程序的操作流程
- linux 爬虫工具,技术|如何在Ubuntu 14.04 LTS安装网络爬虫工具:Scrapy
- 使用xmanager连接centos5.5
- IOS 高级语法与设计模式5(5.3 协议的基本概念及用法)
- Val编程-val系列编程思想
- [Leedcode][JAVA][第46题][全排列][回溯算法]
- 字符串、文件操作,英文词率统计预处理
- C++之 伪随机数的生成
- HDU2161 Primes
- 常用 doc bat 命令总结
- Ubuntu之更新CMake的版本
- python运维脚本面试_参加Linux运维面试时经常会被问到的shell脚本问题有哪些?
- 【数据结构】栈的基本操作
- VMware workstation 16 pro下载、安装(官网)
- 【JAVA基础】Java基础之-代理详解
- 办公室网络带宽叠加(有线和WiFi同时使用)
- 超低频测试信号产生电路软件流程图,一种0_20Hz超低频信号发生器的设计与实现...
- php生成分子式,php 转化smiles为分子式
- hihocoder 博弈三连发
热门文章
- python sys模块_Python 基础(二十):sys 模块
- 作者:包阳(1978-),男,北京系统工程研究所副研究员。
- 【软件质量】软件质量
- 【离散数学】命题逻辑符号化例题
- 【Git】Git解决文件本地更改的合并覆盖错误
- 密码学的数学模型及其理论基础 【二】
- “附近的小程序”可以直接找“餐饮” 非管理员也能登录小程序了
- (原+转)ubuntu终端输出彩色文字
- Jstatd命令(Java Statistics Monitoring Daemon)
- VLAN基本通信原理