基于html的自我学习笔记

-陈福城-

已于 2023-05-02 20:43:06 修改

阅读量54

点赞数

文章标签： html 学习 servlet

于 2023-04-06 19:38:25 首次发布

本文链接：https://blog.csdn.net/qq_67357048/article/details/129997479

版权

<html></html>文本之间描述网页
<body></body>文本的可见内容
块级元素 占用一行 
<h1></h1>文本被显示为标题  标题之间用h1-h6进行定义 文字粗细 搜索引擎使用标题为您的网页的结构和内容编制索引。
因为用户可以通过标题来快速浏览您的网页，所以用标题来呈现文档结构是很重要的。
<p></p>文本被显示为段落
<a href="htttps://baidu.com"> 文本 </a>定义HTML链接，超链接，页面跳转
href 表示指定的链接地址
<img src="w3c.jpg" width="123" height="123" />显示图像，图像的位置，大小自定义
<br /> 定义换行 /是关闭空元素的方式
<hr />在页面中创建水平线
<u>下划线
<i>斜体
<b>加粗
<del>删除
&nbsp空格
<html lang="en">让电脑认为你是以英文形式编辑 实际上没变坏
<mate charsert="UTF-8">
 <li>标签用于表示文档中列表的项目，在下述例子中，我们分别在有序列表和无序列表中使用了<li>标签。
一个有序列表 (<ol>) 和 一个无序列表 (<ul>) :
<pre>预格式化
<address>斜体-联系地址
dl 自主列表
dt
dd
artcle 独立的文本
header 文本的表头
section 文本的内容
上三对文本显示没有帮助
footer 
aside 表示当前页面的附属信息，参考资料
没在artcle中 是侧边栏
nav 页面导航功能 主要的链接放在这里 方便阅读
figure 规定独立的流内容 表示独立的内容 文档图像
figcaption 图片的名字 不是内容
strong 强调作用 黑体
em 强调标签 斜体
mark 突出文本显示黄色背景
meter 进度条
progress  进度条表示完成 正在加载 动画
audio 放音频 src地址 autoplay是否需要自动播放 controls 是否需要进度条 muted 让音频静音 loop循环播放
video 视频播放器 controls进度条 
embed 插入各种多媒体
marquee 文字滚动标签
details  用于用户点击标题时 显示隐藏子标签
summary 标签 显示标题 后面的点击后显示
属性：
HTML可以拥有属性 name="value"
<h1 align="center"> 使文本中心对齐
<body bgcolor="yellow"> 网页背景颜色
<table border="1"> 定义HTML的表格 表格边框
class 元素的类名
id 元素的唯一id
style 元素的行内样式
title 元素的额外信息
span 标签没意义 但是设置css用这个好选择css样式 		 行内元素
css 内容和样式的分离 层叠样式表
link 引入外部样式表 放在head
style 内部样式表
body style 行内样式表
选择器 h1 ···标签  class和id的区别  
1.标签选择器 html中的任何都可以
2.类选择器 p class=“p1” 类名 （以字母开头）
3.id选择器 p id=“p1” 类名 （以字母开头）通常单个

类选择器大于大于外选择器
类选择器 .类名 与p1类名的区别
color 颜色 alt 鼠标左键 rgb( )
overflow 溢出隐藏 
文本样式
text-indent     首行缩进 em 一个字的大小
line-height      行间的距离 22px 4 （4*16px） 250% 父元素乘百分比 normal  原本大小 em默认  从父元素继承什么意思
letter-spacing 字符间距的大小 
text-align        文本的对齐方式
margin：         0 auto 居中
border:            1px solid red; 边框
text-decoration 文本的修饰 下划线 上划线等
text-transform   文本大小的转换
white-space       处理元素中的空白
word-spacing    单词之间的空白
p:first-letter{}     文本首字下沉效果 只针对第一个字的样式 p块状元素
float                    浮动（跟word图片与文字的格式一样）
字体样式
font-family 字体样式 多个字体，号隔开，第一个匹配不了用第二个
font-size     文本的大小
font-weight 字体的粗细
font-style  字体风格 
float浮动了变成块状元素
clear 清除浮动造成的影响