ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

前端基础知识1

2022-02-20 20:59:21  阅读:94  来源: 互联网

标签:样式 前端 元素 基础知识 样式表 表单 选择器 css


HTML

1.标题标签:h1-h6

2.段落标签:p

3.内联元素,行内元素:inline 排列在一行,宽度0;内容宽撑开宽度,默认有高度。不支持宽高调整。

4.块元素:block 独占一行 默认没有高度,高度内容高来撑开,支持宽高调整。

5.内联块元素:inline-block img:可以调整宽高,不独占一行

6.相对路径 绝对路径

7.超链接:a

Ⅰ跳转,交互:<a href="url?参数名=参数值&参数名=参数值"></a>

Ⅱ执行js代码段:<a href="javascript:js代码段"></a>

Ⅲ发送邮件:<a href="mailto:邮箱url"></a>

Ⅳ锚点链接:定义锚点: <a name="值"></a><a id="值"></a>定位锚点: <a href="#值"></a> <a href="url#值"></a>

8.有序列表:ul>li 无序列表 ol>li 自定义列表 dl>dd

9.emment: * > + [] {} . #

10.表格 table>tr>td

11.属性:

width:宽度

height:高度

border:边框

background:背景颜色

align:水平对齐

cellspacing:内间距

cellpadding:内边距

12.单元格合并:

colspan="number"(列合并)

rowspan="number"(跨行列合并)     

13.

表单:
 <form></form>
 action:url地址
 提交方式:
 method:get | post

 默认值:文本字符串
 enctype="application/x-www-form-urlencoded"
 
 *************************
 表单出现了 file 浏览框(文件上传)
 enctype="multipart/form-data"
 post提交 
 
 表单控件、表单元素:
 <input type="text|password|radio|checkbox|file|email|submit|reset|image...">
 <select>
   <option>...</option>
 </select>
 
 <textarea>
 
 </textarea>
<button type="submit|reset|button"></button>
 

css

css :级联样式表、层叠样式表、样式表
css3.0
作用:修饰html元素;代替了html内置属性,
css样式属性具备通用性。
结构代码与表现层进行分离,
维护、二次开发更简单。
更有利于seo优化。

书写位置:
1、头部css样式(初学推荐)
<head>
   <style>
      选择器{
          css样式属性;
      }
   </style>
</head>
2、外链css样式(开发标准)
  新建 .css
  <link rel = "stylesheet" href="url" />
3、内联样式、行内样式(调试样式)
   <标签 style="css样式"></标签>
   
语法:
 *****选择器是核心******
选择器:帮助获取要修饰html元素
提供四个基本选择器:

统配选择器:匹配页面的所有元素
* { 
    color:red;
}
标记选择器:
标签名 {
    
}
a { 
    
}
p{
    
}

类选择器{
    
}

id选择器{
    
    
}

标签:样式,前端,元素,基础知识,样式表,表单,选择器,css
来源: https://blog.csdn.net/qq_45605563/article/details/123035570

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有