notes

最新推荐文章于 2024-05-27 22:59:39 发布

LGQzs

最新推荐文章于 2024-05-27 22:59:39 发布

阅读量718

点赞数

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

本文链接：https://blog.csdn.net/LGQzs/article/details/73727539

版权

html 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

html与css总结

html部分

常用基础标签

带有语义的标签

em，强调
strong ，比em强调级别更高
abbr，定义缩写，与title属性相互搭配使用
address，定义地址元素
blockquote，定义块引用，通常情况下会产生缩进
cite，通常情况下，某段话引子某本书，可以使用cite进行说明
ins，定义被插入文本
del，定义被删除文本

带有一定样式的标签

b，定义粗体文本
i，定义斜体文本
big，定义大号文本
small ，定义小号字体文本
sup，上标文本
sub，下标文本
bdo，定义文本显示方向，属性：dir，值，ltr，rtl

输出类标签

pre，代码中样式原样输出
code，定义计算机代码文本
kbd，定义键盘文本
var，定义变量

功能类标签

a标签-定义超链接实现页面跳转,定义锚点实现书签功能.
ul,li标签-无序标签
ol,li标签-有序标签
iframe标签-页面嵌套
dl,dt,dd-项目列表描述
img标签-图片标签，其中有alt属性(图像替代文本),width和height属性(宽和高)，ismap属性(定义图像映射的一张图像)。链接跳转的图像,将图片嵌套在a标签中。
table标签-表格，其中包括caption标签(标题),th标签(页眉),tr标签(行),td标签(单元格),thead标签(表格头部),tbody标签(表格主干),tfoot标签(表格尾部)。
base标签-页面所有链接的基础链接，位于head标签中。

form标签

input标签

type属性及其相关值:button，file,hidden,text,password,radio,checkbox,image,reset,submit.
alt属性，定义当按钮为图片时，图片的替代文字。
src属性，定义当按钮为图片是，图片的链接地址。
checked属性，定义默认选项。
disabled属性，禁用当前输入域。
readonly属性，对当前输入域只读。
maxlength属性，定义输入域字符的最大长度。
name属性，定义当前输入域的名字。
value属性，定义当前输入域的默认值。

textarea标签

cols属性，规定可见列数。
rows属性，规定可见行数。
disabled属性，禁用当前文本输入区。
name属性，当前文本的名字。
readonly属性，对当前文本只读。

button标签

disabled属性，禁用这个按钮。
name属性，按钮名字。
type属性，按钮类型(button,reset,submit)。
value属性，按钮的显示文本内容的默认值。

select标签

optgroup标签-定义下拉列表选项分组

label属性，定义选项组的标记，必要属性。
disabled属性，禁用。

option标签-定义下拉列表中的选项

label属性，定义当使用时所使用的标注。
selected属性，规定选项（在首次显示在列表中时）表现为选中状态。
value属性，向服务器输送的值。

fieldset标签

定义分组标题。

css部分

css选择器(下面标签用div代替)

基础选择器

html标签选择器-div{}
id选择器-#id{}
class选择器-.class{}

综合选择器

后代选择器-div div
交集选择器-div.class
并集选择器-div，class
直系子元素选择器-div>div
序列选择器-ul li:first-child{},ul li:last-child{}
相邻兄弟选择器-div+div
普通兄弟选择器-div~div

继承与层叠

继承

父元素的某些css属性会被子元素无条件的继承过去。关于文字的css属性都可以进行继承：color text- line- font-等。

层叠

层叠解决的是css冲突的问题，主要通过比较权重来解决层叠问题，!important 能够把”单独属性”的权重变为无限大，应当尽量少用，因为这样会使规则没有约束力。

块级元素和行内元素的区别

块级元素会独占一行，其宽度自动填满其父元素宽度行内元素不会独占一行，相邻的行内元素会排列在同一行里，知道一行排不下，才会换行，其宽度随元素的内容而变化
一般情况下，块级元素可以设置 width, height属性，行内元素设置width, height无效(注意：块级元素即使设置了宽度，仍然是独占一行的)
块级元素可以设置margin 和 padding.行内元素的水平方向的padding-left,padding-right,margin-left,margin-right 都产生边距效果，但是竖直方向的padding-top,padding-bottom,margin-top,margin-bottom都不会产生边距效果。（水平方向有效，竖直方向无效）