html学习(一)

news/2024/11/19 7:30:29/

代码标签

< head >用于存放title、meta、base

双标签

<标签名> 内容 </标签名>

< body > 标签开始的地方
< /body >标签结束部分
/ 标签结束部分

单标签

<标签名 />
也称为空标签,例如:< br /> 换行

标签关系

< html >
< head >
< title > < / title >
< /head >
< body >
< /body>
< /html>

嵌套关系

也就是父子关系
< html >是根标签,是一切标签的父标签
< head>是< html>的子关系,以此类推。

并列关系

也就是兄弟关系,例如:< head >与< body>是并列关系

开发工具

在这里学习的是Sublime

在sublime软件中快速生成html骨架,可以用“html:5”按Tab键即可生成或者直接输入“!”按Tab键也可以生成骨架。
快速生成html骨架
< !DOCTYPE html> 表示到底使用的是哪个版本的html,在这里使用的是html 5
< meta charset=“UTF-8” >表达的是用的是那个字符集 gb2312简体中文,BIG5繁体中文,GBK同时包含简体和繁体两种,utf-8则是表示包括全世界所有的国家使用的字符。

html标签语义化

先确定语义的html,再选合适的CSS

常用的html标签

排版标签

标题标签

< hn> 标题内容 < /hn>
< h1> < h2> < h3> < h4> < h5> < h6>,其中< h1>是最重要的,常用语logo
标题标签

段落标签

< p >文本内容< /p>
段落标签

水平线标签

< hr />是单标签
水平线标签

换行标签

< br />是单标签
换行标签
与段落标签相比,段落标签之间的距离比换行标签大一些。

div span标签

< div> 内容< /div>本身没有语义,只是在网页上开辟了一块区域。
< span> 内容 < /span>本事也没有语义,在已经开辟的区域上有一块透明的区域,只在span区域进行操作,div区域可不动。

文本格式化标签

< strong> < /strong>粗体
< em> < /em>斜体
< del> < /del>删除线
< ins> < /ins>下划线

	<strong>1.金秀贤</strong><br /><em>2.全智贤</em><br /><del>3.刘仁娜</del><br /><ins>4.朴海镇</ins><br />

文本格式标签

标签属性

使html标签有更多的属性,可以通过这个进行设置。
< 标签名 属性1=“属性值1” 属性2=“属性值2”…> 内容 < /标签名>
标签名与属性之间用空格隔开,属性与属性之间用空格隔开

	<hr width="500"  color="red"/>

水平线长度为500 颜色为红色

图像标签

< img /> 图像标签用于展示图像。

属性描述
scr图像路径(URL)
alt图像不能显示时的替换文本(文本)
title图标悬浮时显示的内容(文本)
width设置图片宽度(像素)
height设置图片高度(像素)
border设置图像边框的宽度(数字)

1.< img scr=" 图片URL" />在这里图片URL是在.html文件下同一个文件夹下的图片才能被获取到。

<img src="APP.jpg" />

插入图片url

2.< img scr=“图片URL” alt=“文本” />alt是当图片显示不出来时的提示文本。

<img src="APP1.jpg" alt="找不到图片" />  <br />

找不到图片的提示文本
3.< img scr=“图片URL” title=“文本” />title是当鼠标悬停在图片上时出现的文字。

<img src="APP.jpg" title="抖音" />  <br />

鼠标悬停展示文本
4.< img scr=“图片URL” title=“文本” width=“600” height=“400” />设置图片的大小。

<img src="APP.jpg" title="抖音" width="600" height="400" /> 

图片设置大小
5.< img src=“APP.jpg” title=“抖音” width=“600” height=“400” border=“10” /> < br />设置标签边框

<img src="APP.jpg" title="抖音" width="600" height="400" border="10" />  <br />

设置边框


http://www.ppmy.cn/news/377801.html

相关文章

苹果手机闹钟声音大小怎么调_偷偷安利5款让手机体验到爆的app,乐趣满满

今天来给大家带来5款手机端实用、高效的免费破解趣味神器&#xff0c;有了它们一定会大大提高使用手机的效率与舒适。认真看下去&#xff0c;一定收获满满&#xff01;所有资源获取均在文末 1 iCountTimer 1.1 简介 iCountTimer Pro 是一款简单、实用的锻炼计时器和计数器。一个…

javaSE------5.IO流

1.File 类 1.1 File类概述和构造方法 File 类介绍&#xff1a; 它是文件和目录路径名的抽象表示 文件和目录是可以通过 File封装成对象的 对于 File而言&#xff0c;其封装的并不是一个真正存在的文件&#xff0c;仅仅是一个路径名而已。 它可以是存在的&#xff0c;也可…

JDBC高级

《JDBC高级》笔记 junit使用Scanner在idea中卡死的设置 2017版&#xff0c;可以直接编辑这个文件&#xff1a;安装目录 C:\Program Files\JetBrains\IntelliJ IDEA 2019.1.3\bin\idea64.exe.vmoptions 在最后面添加1行&#xff1a; -Deditable.java.test.consoletrue 2019版…

揭秘奢侈品代工厂内幕:千元以上的大牌墨镜,成本甚至不过百!

▲ 点击查看 纵观全球 没有哪个国家 像中国这样几乎所有领域都在发力 世界能研发高铁的国家&#xff0c;不超过十个&#xff0c;中国在列&#xff1b; 世界能建造军舰的国家&#xff0c;不超过十个&#xff0c;中国在列&#xff1b; 世界能研发第五代隐身战机的国家&#xff0c…

高性能WEB开发之如何加载JavaScript

所有浏览器在下载JS的时候&#xff0c;会阻止一切其他活动&#xff0c;比如其他资源的下载&#xff0c;内容的呈现等等。至到JS下载、解析、执行完毕后才开始继续并行下载其他资源并呈现内容。为什么JS不能像CSS、image一样并行下载了? AD&#xff1a; 外部JS的阻塞下载 所有浏…

痛点与痒点——谈谈互联网产品的运营感

“痛点”已经成了今天互联网概念的滥觞。 其实在今天&#xff0c;互联网产品极大丰富的今天&#xff0c;中关村一块砖砸下来&#xff0c;准能砸着两个创业者一个投资人的今天&#xff0c;抓一个痛点没那么有效了。 也许更有意义的是&#xff1a;“痒点”。 《五十度灰》大热&am…

Python爬虫入门——爬取贴吧图片

最近忽然想听一首老歌&#xff0c;“I believe” 于是到网上去搜&#xff0c;把几乎所有的版本的MV都看了一遍&#xff08;也是够无聊的&#xff09;&#xff0c;最喜欢的还是最初版的《我的野蛮女友》电影主题曲的哪个版本&#xff0c;想起女神全智贤&#xff0c;心血来潮&…

明星热图|欧阳娜娜、张艺兴代言新品牌;吴彦祖、高圆圆、全智贤演绎服装新品;关晓彤、欧阳靖、张云龙出席品牌活动...

图片是企业新闻传播的要素之一&#xff0c;优秀的图片使读者能更直观地了解新闻内容。“一周热图”栏目为大家展示每周通过美通社发布的最具代表性的企业新闻图片。 服装 潮流运动品牌FILA FUSION正式签约首位品牌代言人欧阳娜娜&#xff0c;这位出生于艺术世家的00后&#xff…