AI智能
改变未来

2020-07-28 HTML、CSS基础学习


———–HTML——–

网页头部

网页脚步部

nav导航类

iframe:内联框架,在网页中调用另外一个网页
src:网页地址
w-h:宽度高度

————————————–表单提交post、get————————————–
form标签,method:提交方式,action:发生什么,指向哪里

get方式提交:我们可以通过url看到我们提交的信息,不安全,但是高校
post方式提交:比较安全,可以传输大文件

input的type:
radio:单选框,如果type是radio的话,value就是指的是选项的值
如果type是text,value指的是默认值,name值相同,就是用的同一个单选框

多选框:checkbox,value,name必须保持一致,加一个checked是默认值

按钮:button,value表示的是按钮上的值

下拉框:不是input标签

文本域

文本内容

带功能标签

滑块

搜索框:

表单的应用:
readonly:只读
hidden:隐藏域
禁用:disable

增强鼠标可用性

表单验证:
//默认值,用作提示信息,输入框中
required:不能为空
pattern:

—————-CSS基础—————-

选择器,美化网页,超链接,列表,渐变,盒子模型,浮动,定位

快速入门–基本用法
style

内部引用:直接在head体中直接写
外部引用:新建一个css,直接link,href中直接写路径

—————————–css的导入方式
一.行内样式,直接在标签中直接写样式
二.内部样式:head体里写
三.外部样式:外部文件导入
优先级:行内样式>内部样式>外部样式,就近原则,谁近谁起作用

——————————css的选择器
选中页面的某个或某种元素

-----------标签选择器--------选择一种标签

打出#号之后,可以自选颜色

———–类选择器———点开头,选择class相同的一类标签

我是标题

可以多个标签归类,视为同一类

———–id选择器———-#开头——–特殊的那个ID的标签

我是标题

id必须是唯一的这三种选择器针对同一个标签对象的话,id选择器>类选择器>标签选择器

——————————–层次选择器—————————-
后代选择器:后代全部更改
body p {
color:red;
}
子选择器:只有下一代变
body>p {
color:red;
}
相邻兄弟选择器
active是class名,相邻是向下
.active + p{
color:red;
}
通用兄弟选择器:当前选中元素向下所有兄弟元素
.active ~ p{
color:red;
}

———————-浮动———————

block是块元素的意思
inline是行内元素的意思
**sidplay:block;**定义元素的块还是行
inline-block是块元素,但是可以内联,并列一行
float:浮动

写在CSS方法内:
clear:both/right/left—————不允许有浮动,如果父级边框塌陷后,排入下一行

——————定位—————–

相对定位:相对原来的位置进行偏移
position:relative,上下左右
绝对定位:基于xxx定位
position:absolute
(1)如果没有定义父级元素的话, 就针对浏览器进行定位
(2)假设父级元素存在定位,通常对父级元素进行偏移

赞(0) 打赏
未经允许不得转载:爱站程序员基地 » 2020-07-28 HTML、CSS基础学习