web前端基础-学习笔记

最新推荐文章于 2024-05-31 14:49:19 发布

听926

最新推荐文章于 2024-05-31 14:49:19 发布

阅读量17

点赞数

文章标签：前端学习笔记

本文链接：https://blog.csdn.net/qq_69007563/article/details/133689520

版权

#开发环境
   #开发软件
       记事本，notepad++ hbuilder vscode

   #运行软件
       浏览器：谷歌 + 其他（市场占有率比较高的浏览器）


   #html页面结构
       <!doctype html> 告诉浏览器以下的代码都已html5的方式解析
       <html> 主题
           <head>
               <mate chaset="utf-8">
               <title>左上角命名</title>
           </head>

           <body>
           hello world

           </body>

       </html>

# heml语法与元素
       -注释 
       -文本 / 字符串
       -标签（不区分大小写，一般使用小写）
           -单标签
           -双标签
           继续嵌套其他标签或者字符串

             空格

       -属性
       <标签名属性名=“属性值” 属性名=“属性值”></标签名>
   #前端常见的标签
       #字体标签<font></font>
       作用：设置某个区域的文本字体
       属性：color=“red” 颜色
           size=“1” 字体大小1~7
           face=“宋体” 字体类型

   #对齐格式
       左对齐:left 居中：center 右对齐：right

       #段落标签（块级元素，一个占一整行）
       <p></p>
       <br> 换行
       <hr> 分割符
       -标题标签<h1></h1>~<h6></h6>

       #图片<img>
       作用：承载图片 / 访问服务器
       属性：src="路径" width=“数字” height=“数字”

       #超链接 <a></a>
       作用：页面跳转 / 访问服务器
       属性：href=“地址”
           1.跳转本地页面，填写相对路径
           2.跳转外网的网址，网址前加 http://

       #下拉选项标签
           <select>
               <option></option>
               <option></option>
               <option></option>
           </select>

       #表单输入标签<input> 有多种形态
           属性：
               type="text" 文本框
               type="password" 密码框
               type="button" 按钮 value=" "
               type="checkbox" 复选框 √
               type="radio" 单选框
               type="file" 文本选择器
               type="date" 日期选择器

               placeholder="显示内容" (当没有输入时文本框显示内容)

       #表格标签
           <table></table> 表格的主体标签
               属性 border="1" （表格边框）
                   width height 表格，单元格
                   bgcolor 表格，单元格
                   align="left" center right
           <thead></thead>   表格的表头
           <th></th> 表头中的单元格
           <tbody></tbody> 表格的身体
           <tr></tr> 表格的行
           <td></td> 表格的普通单元格

       #合并单元格
           水平方向合并 colspan="格数"
           垂直方向合并 rowspan="格数"
           水平+垂直 colspan rowspan