首页 / 知识

最新HTML、CSS基础知识整理

2023-04-11 13:48:00

最新HTML、CSS基础知识整理
　　HTML：
 
　　1. img标签路径
 
　　2.a标签
 
　　锚点定位，代码如下：
 
　　拨打电话：
 
　　协议限定符
 
　　3.p标签
 
　　成段落展示（独占一行）
 
　　4.form标签
 
　　表单属性：
 
　　action属性：提交的地址
 
　　method 属性：提价的方式，get/post
 
　　name属性：表单名称
 
　　表单元素：
 
　　input标签
 
　　input的type有：text（文本格式）、password（密码）、radio（单选）、checkbox（多选）、submit（提交按钮）
 
　　提示：
 
　　a、label标签可以为input标记，其中label的for对应input的id，如下：
 
　　b、每一项input需包含一个name（数据的键名）
 
　　c、radio和checkbox，可通过设置同一个name，组成一组，如下：
 
　　d、radio和checkbox可以通过设置checked设置成默认选项
 
　　e、placeholder可设置input框的提示文字
 
　　f、disabled 属性规定输入字段是禁用的
 
　　select标签
 
　　下拉列表，通过设置option定义每一项，option可通过设置selected来设置默认，如下：
 
　　textarea标签
 
　　元素定义多行输入字段（文本域），如下：
 
　　CSS：
 
　　class选择器，可以为一个标签添加两个class，代码如下：
 
　　常用通配符，作用所有的标签，代码如下：
 
　　CSS优先级，如下：
 
　　父子选择器，如下
 
　　直接子元素选择器，如下
 
　　分组选择器，如下：
 
　　display
 
　　display:block,块级元素，独占一行，如：div p ul li ol等；
 
　　display:inline,内联元素/行级元素，内容决定所占位置，如：span a em del strong（注意：凡是带有inline的元素，都有文字特性，会带有4个像素的margin，决解办法：margin-left=-4px）；
 
　　display:inline-block,行内块元素，如：img；
 
　　其他
 
　　文本中横线或下划线：text-decoration;
 
　　鼠标移入的效果：cursor:help;
 
　　设置元素的垂直对齐方式：vertical-align
 
　　：before 和 :after可用于左中右三栏布局
 
　　左右布局，代码如下：
 
　　margin塌陷bug，margin-top相较于父元素会出现塌陷问题，可以通过给父元素设置overflow: hidden/position: absolute/float:left/display:inline-block解决
 
　　position
 
　　position：absolute，绝对定位，脱离原来的位置进行定位，以最近的有定位的父级进行定位，如果没有那么相对于文档进行定位；
 
　　position：relative，相对定位，保留原来的位置进行定位/相对自己原来的位置进行定位；
 
　　position：fixed，绝对定位，相对于浏览器窗口进行定位；
 
　　（注：在实际开发中，一般父级使用position：relative定位，子级使用position：absolute定位，这样不会影响其他元素，引起位置错乱）
 
　　float:left
 
　　使用浮动后会对后面的元素（不需要使用浮动的元素）产生浮动流，可以通过clear:both清浮动流；一般情况通过设置父元素的伪元素清除浮动，如下：

标签属性表单提交地址定位

最新内容

相关内容

热门文章

推荐文章

标签云

猜你喜欢