HTML+CSS基本标签（属性）

最新推荐文章于 2024-07-06 23:14:34 发布

前端-阿杰

最新推荐文章于 2024-07-06 23:14:34 发布

阅读量628

点赞数 8

分类专栏： html css 文章标签： html css html5

本文链接：https://blog.csdn.net/weixin_50343572/article/details/113586897

版权

css 同时被 2 个专栏收录

4 篇文章 0 订阅

订阅专栏

html

3 篇文章 0 订阅

订阅专栏

前端小菜，多多谅解！

HTML常用标签：
<!DOCTYPE html>: 声明帮助浏览器正确地显示网页；
<html></html> : 网页描述，定义整个HTML文档的；
<body></body>: 页面可见内容，页面主题内容；
<meta></meta>: 提供页面相关元素等等,描述文档信息；
<title></title>: 头部标签，浏览器顶部标题；
<style></style>: 内部可以定义元素样式；
<link></link>: 引入外部css文件；
<script></script>:标签内部可以写js方法、事件。src属性可以引入外部js文件；
<head></head>: 所有头部元素的标题，定义关于文档的信息；
<div></div>: 常用的块级标签，一行只能有一个，定义文档中的分区或节；
<span></span>: 常用的行内标签，一行可以有多个，组合文档中的行内元素；
<h1></h1>......<h6></h6>: 标题标签，h1最大，h6最小；
<p></p>:段落标签，一般也用作换行；
单标签一律都在末尾加上 /,表示标签闭合；
<a href=" "></a>: 点击跳转链接，href属性填写你要去的页面；
<img src=" " />; 图片标签，src属性放入你要显示的图片。
<br />: 换行；
<hr />: 水平线；
<!-- 注释内容 -->：html注释。不会运行在页面，快捷键Ctrl+/;
<b></b>: 文本粗体 ；
<em></em>: 着重文字；
<i></i>: 文本斜体；
<strong></strong>: 加重语气;
<sub></sub>: 文本下标对齐；
<sup></sup>:文本上标对齐；
<del></del>: 文本删除线；
<table></table>: 表格；
<caption></caption>: 表格标题；
<th></th>: 表格表头；
<tr></tr>: 表格的行
<td></td>: 表格单元；
<thead></thead>: 表格页眉；
<tbody></tbody>: 表格主体；
<tfoot></tfoot>: 表格的页脚；
<ul></ul>: 无序列表，type: disc 默认实心圆； circle 空心圆； square 实心方块； none 无样式；
<li></li>: 列表项；
<ol></ol>: 有序列表，type： 1 默认数字列表；A 大写字母； a 小写字母； I 大写罗马； i 小写罗马；
<header></header>: 头部标签，使其代码更加一目了然；
<nav></nav>: 页面导航，里面元素可以根据id跳转到对应页面元素！
<section></section>: 定义文档中的节，对内容进行有意义的分块；
<acticle></acticle>: 定义独立的自包含文章；
<footer></footer>: 底部标签，同<header>标签；
<iframe></iframe>: 在网页内显示网页，frameborder="0"移除边框；
<base />: 定义页面上所有连接的默认地址或默认目标；
&nbsp； 空格、&lt； 小于号、&gt;大于号、&amp；和号；
<form></rorm>: 表单元素，用于手机用户输入的信息；
<input  type=" " value=" " />:文本输入框，type="text" : 文本输入框(默认)、type=" radio" : 单选按钮、type="password" : 密码输入框、type="submit" : 提交按钮、type="button" ：按钮、type="checkbox"、type="number" ：数字框； value ：输入的值；
<select></select>: 下拉列表；
<option></option>: 待选择的选项；
<button></button>: 按钮；
<audio></audio>: 声音或音乐；
<video></video>: 视频或影片；
Css常用选择器：
* { }：通配符选择器，选择所有元素；
 #id名 { }：id选择器，通过id来获取元素；
.class名 { }：类选择器，通过class来获取元素；
[元素属性] { }：通过元素的属性来获取元素；
a:link { }：未被访问的链接；
a:visited { }：已被访问的链接；
a: active { } :正在被点击的链接；
a:hover { }: 鼠标指针移入到元素上；
父元素 子元素 { } ：后代选择器；
父元素 >子元素 { }：子元素选择器，选择父元素下第一个子元素；
子元素 +子元素兄弟：兄弟选择器；





Css常用属性：
width：宽度；
max-width：元素的最大宽度；
min-width：元素的最小宽度；
height：高度；
line-height：行高，行高等于父元素盒子高度可以做到文字垂直居中；
max-height：元素的最大高度；
min-heigth：元素的最小高度
font：字体属性；
font-size：字体大小；
font-family：定义文本的字体系列；
font-style：字体样式(风格)；
font-weight：设置字体粗细；
color：文本颜色；
background：背景属性；
background-color：背景颜色；
background-image：背景图片；
background-repeat：背景是否重复；
background-position：背景定位；
text-align：文本对齐方式（设置为center可以做到文本水平居中）；
line-height：文本行高（文本行高等于盒子高度可以做到垂直居中）；
text-shadow：文本阴影；
padding：内边距（四个属性：top、right、bottom、left）；
margin：外边距(同padding) ，0 auto可以做到水平居中；
border：边框；
position：static（默认）；
position：relative（相对定位）元素偏离但是原本所占的空间仍保留；
position：absolute（绝对定位）元素偏离而且不占地方，就像浮起来了一样；
position：fixed（固定定位）；
overflow：hidden（元素超出父元素区域隐藏超出部分）；
z-index: 设置元素的堆叠顺序；
float：元素浮动，直至碰到父元素的边缘（left、right）；
clear：设置一个元素的侧面是否允许其他的浮动元素(both属性可以清除浮动)；
cursor：规定当指向某元素之上是县实地指针类型；
display：设置如何显示元素；
visibility：设置元素是否可见或不可见；
opacity：透明度；