学习HTML过程中的笔记

xiaoxiao2023-03-28 11

跳过的知识

CSS章节跳过

内置框架 http://www.w3school.com.cn/html/html_iframe.asp

跨行或跨列的表格单元格本例演示如何定义跨行或跨列的表格单元格。链接http://www.w3school.com.cn/html/html_tables.asp

创建图像映射把图像转换为图像映射本例显示如何把一幅普通的图像设置为图像映射。本例显示如何创建带有可供点击区域的图像地图。其中的每个区域都是一个超级链接。链接http://www.w3school.com.cn/html/html_images.asp#more_examples

命名锚跳过(打开一个网页并跳转到指定位置)

创建电子邮件连接所在位置：链接

------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

<p>段落会省略文字中的空格和回车，想换行<br />，但<p>的开始会切换到下一行

属性style可以用于<p>或<body> font-size:文字大小 color:文字颜色 background-color:底色 font-family:字体

格式< p style="font-size:30px">

<img>添加图片或动画属性src (src 指 "source")

属性width宽 height:高

实例:如果名为 "boat.gif" 的图像位于 www.w3school.com.cn 的 images 目录中

为 http://www.w3school.com.cn/images/boat.gif

属性alt：如果无法显示图像，将显示 alt 属性中的文本

格式<img src="位置（空格）a.jpg" width="300" height="400" alt="字"(空格)/>

图像的对齐,属性:align

实例

不知为啥以上三行我这里不好使

实例

<p>

哈哈哈

</p>

（图像出现在哈哈哈的左侧。） <p> <img src ="1.gif" align ="right">

哈哈哈 </p>

（图片出现在哈哈哈的右侧）

<ins>文字下划线

<del>在文字上加斜线（删除文字）

<bdo>改变文字的方向属性dir

格式<bdo dir="rtl">abcdefg</bdo> (rtl会使文字反写)我们得到的结果是gfedcba

<q>短引用(会自动加“”)

<blockquote>长引用(会自动改变文字缩进方式) 属性cite(单词意思:引用)

格式<blockquote cite="www.baidu.com">你好世界</blockquote>

<abbr>缩写以及首字母缩写，属性：title

格式<abbr title="world health organization">www</abbr>

<dnf>(定义)可以用做另一种缩写的写法，属性title

格式<dnf title="world health organization">who</dnf>

使用缩写能为翻译系统搜索引擎叶公有用信息

<address>联系人地址

<cite>书名(一般会体现斜体)

格式<cite>海边的卡夫卡</cite>

通常html文字大小和间距可变，但是计算机的一些代码需要固定的字大小和间距

例如：<kbd>键盘录入 ;<samp>计算机输出；<code>计算机代码(不保留空格和回车)

<pre>保留文本中的空格和回车

<var>定义数学变量

举个栗子：

爱因斯坦的公式：E = m c²

^{<p><var>E</var>=<var>m</var><var>c</var><sup>2</suo></p>}

^{HTML中注释的格式：}

它和C++的用法相同，可以注释掉一些行，用于调试

点击图片打开其他网页(只有在电脑本机的链接才行，即html文档)

举个栗子(直接在原网页所在页面上打开)

</a>

假入被锁在了框架里，挑出框架

举个栗子(在另一个网页上打开)

<a href="1.html"target="_blank"> 注意红色的隔开部分是一个空格，不能用分号

</a>

被卡在了框架里，想要跳出框架（大概是重新打开此页，位置是网页开头）

<a href="目前所在网页链接" target="_top">一些提示性词如：请点击这里</a>

设置页面背景图片，实例：<body background="1.jpg">

如果如果背景图像小于页面，图像会进行重复

表格

<table>表格开始属性:border(边框)一般设为1，弱不需要边框可以直接不写border这个属性属性:cellpadding指单元格内字和边框的距离（英语也是这个意思）

<tr>行开始

<td>数据开始 (数据可以是任何东西，数字，文字，图片……)

<th表格的第一行，通常是总结性的词..

实例1:一行一列

</table>

输出：

100

实例2:一行三列

</table>

输出：

100200300 实例3:2行三列

</table>

输出：

100200300400500600

实例4

当border="8"时

FirstRowSecondRow

实例5：<th>

输出

姓名电话1123456 实例6 当在一个单元格内不写内容或插入空格，这个格子的里面的边框会消失,如下图

此时要让格子不消失应插入空格占位符，即该单元格的内容是<td> </td> （注意分号别丢了）

实例7 cellpadding

<table border="1" cellpadding="8"> <tr><td>First</td> <td>Row</td> </tr> <tr><td>Second</td> <td>Row</td> </tr> </table>

输出：

FirstRowSecondRow

实例8 为整个表格添加背景颜色或背景图片

a添加背景颜色

属性bgcolor

b添加背景图片

属性 background

实例9 为一个单元格添加背景颜色或背景图片

a背景颜色

<td bgcolor="red">First</td>

b背景图片

<td backgronud="1.jpg">First</td>

实例10

单元格内文字的对齐方式

实例11 frame属性（无法在 Internet Explorer 中使用）……详细自己查，我没学

列表

<ul>无序列表的开始

<ol>有序列表的开始

<li>有或无序列表中每项的开始每一项可以是段落、换行符、图片、链接以及其他列表等等

自定义列表的开始dl 每项的开始dt 自定义的部分dd （觉得很麻烦，而且这个只能呈现写一行后换一行并且首行缩进，类似注释的作用）

实例1 一个无序的列表

输出：

咖啡茶牛奶

注：开头图案可以改变

<ul type="circle"> 改成空心圆

<ul type="square">改成实心正方形

实例2 有序列表

输出

咖啡牛奶茶

注：计数形式可以改变

<ol type="A"> 改成大写英文字母

<ol type="a"> 改成小写英文字母

实例2 有序列表从一个指定数字开始排列属性：start

</ol> <br /> <ol start="50"> <li>咖啡</li> <li>牛奶</li> <li>茶</li> </ol>

输出：

咖啡牛奶茶

大多数 HTML 元素被定义为块级元素或内联元素

块级元素，在显示时以新行来开始。

例子：<h1>, <p>, <ul>, <table>

内联元素，在显示时不以新行开始。

例子：<b>, <td>, <a>, <img>

<div> 元素：定义文档中的分区或节？？啥意思

<span> 元素：定义 span，用来组合文档中的行内元素。？？啥意思

div和类结合，这个div太酷了！！这是我最喜欢的属性，直接放链接，页面一秒变潮！！帅呆了

http://www.w3school.com.cn/html/html_classes.asp

span可以用作一段话中另一种颜色的字……<p>可做不到哦，用<p>会另起一行

言语够简洁了，这里直接放上链接

http://www.w3school.com.cn/tiy/t.asp?f=html_classes_span （注：可以去掉<style>下一行中的span,去掉吧！这样和div一起好记）

这个很好看，但我觉得里面的文字啊，对其啊什么的我看不懂，直接当成模板好了

http://www.w3school.com.cn/tiy/t.asp?f=html_layout_divs

这个也作为模板

http://www.w3school.com.cn/html/html_responsive.asp

模板

http://www.w3school.com.cn/html/html_frames.asp

可以以网站上给的颜色和对应码来设置背景颜色

实例 <body bgcolor="#d0d0d0">

转载请注明原文地址: https://ju.6miu.com/read-1210770.html

最新回复(0)

学习HTML过程中的笔记

FirstRowSecondRow

<span> 元素：定义 span，用来组合文档中的行内元素。 ？？啥意思

<span> 元素：定义 span，用来组合文档中的行内元素。？？啥意思