黑马程序员技术交流社区

标题: 【成都校区】web核心学习笔记 [打印本页]
作者: 醋味可乐    时间: 2019-3-20 13:45
标题: 【成都校区】web核心学习笔记
~~web

    软件架构：
            1.C/S:cilent/sever:用户体验好，但是开发，安装，部署，维护麻烦
            2.B/S:browser/sever:开发，安装，部署，维护简单。但是应用过大，对用户体验有所影响（对硬件要求高）       

    B/S架构详解
            资源分类：
                    *静态资源：使用静态网页开发技术发布的资源
                            1.拥有用户访问，得到结果相同（HTML,CSS,JavaScript）
                            2.如果访问静态资源，服务器会直接将资源发送到浏览器，浏览器中内置了静态资源的解析引擎。
                    *动态资源：使用动态网页技术发布的技术
                            1.所有用户访问，得到的结果可能不同（jsp,servlet,php，asp）
                            2.如果用户请求的是静态资源，服务器会执行动态资源，转换为静态资源，再发送给浏览器

    静态资源；       
            HTML：用于搭建基础网页，展示页面内容
            css：用于界面美化，布局页面
            javascript：控制界面元素，让界面具有动态效果。

html

            1.概念：
                    Hyper Text Markup Language 超文本标记语言
                    超文本：超过了普通文本的范畴，可以显示图片等
                    标记：标签（编写网页的，通过标签来编写网页，通过修改标签的属性来改变内容的显示模式）

    入门：
            *语法：
                    1.html后缀名为html或Htm
                    2.标签分为：
                            1.围堵标签：有开始标签和结束标签。<html></html>
                            2.自闭和标签：开始标签和结束标签在一起。如<br/>
                    3.标签可以嵌套
                            正确嵌套，不能你中哟我，我中有你
                    4.在开始标签中可以定义属性。属性是有键值对构成，需要用引号引起来
                    5.html中不区分大小写，但建议使用小写。

    标签
            1.文件标签
                    *html:html文档的根标签
                    *head:头标签。用于指定HTML文档中的一些属性，引入外部资源
                    *title：标题标签
                    *body：体标签
            2.文本标签？》
                    *注释:<!--内容-->
                    *<h1>~</h1>---><h6></h6>:标题标签（字号大小，依次降低）
                    *<p>：段落标签
                    *<br/>换行标签
                    *<hr/>展示一条水平线
                            *属性:
                            color:颜色
                            width：宽度
                            size:高度
                            align:对齐方式
                                    center:居中
                                    left：左对齐
                                    right:右对齐
                    *<b>字体加粗
                    *<i>斜体
                    *<font>:字体标签
                            color：颜色
                            size:大小
                            face:字体
                    属性定义：
                            * color：
                                    1. 英文单词：red,green,blue（三原色）
                                    2. rgb(值1，值2，值3)：值的范围：0~255  如  rgb(0,0,255)
                                    3. #值1值2值3：值的范围：00~FF之间。如： #FF00FF
                            * width：
                                    1. 数值：width='20' ,数值的单位，默认是 px(像素)
                                    2. 数值%：占比相对于父元素的比例
                           
                           
                   
            3.图片标签
                    *网页在图片的下一级/
                    *网页在图片的上一级../
                    *网页和图片在同一级:直接写图片名称<img src = "相对路径">
                            *相对路径
                                    *以.开头的文件
                                            ./：代表当前目录
                                            ../：代表上一级目录
                            ==2.绝对路径（web开发，web开发不知道盘符是什么）
                                    *目前不能写
            4.列表标签
                    *有序列表
                            <ol>
                                    <li>
                                    </li>
                            </ol>
                    *无序列表
                            <ul>
                                    <li>
                                    </li>
                            </ul>
                   
            5.链接标签
                            <!--   超链接  a href
                *href:要跳转的资源地址
                *target:指定打开资源的方式
                    _self:默认值，在当前页面打开
                    _blank:在新的空白页面打开-->
            6.表格标签
                    *table:定义表格
                            *属性：
                                    width:宽度
                                    border:边框
                                    cellpadding:定义内容和单元格的距离
                                    cellspacing:定义单元格之间的距离
                                    bgcolor:背景色
                                    align:对齐方式
                            <table>
                                    <tr>     定义行
                                            <td>    定义列
                                            *表格中还可以再嵌套表格
                                            </td>
                                    </tr>
                 </table>   
             *合并单元格
                     colspan:合并列
                     rowspan:合并行
             *th用来定义表头
                     <caption>:表格标题
                     <thead>:表示表格的头部分
                     <tbody>:表示表格的身体
                     <tfoot>:表示表格的脚部分



     div和span：
                    * div:每一个div占满一整行。块级标签
                * span：文本信息在一行展示，行内标签 内联标签






欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2