WEB工作原理

1. 认识HTMl - 图1
HTML->WEB服务器->PC/手机端浏览器

HTML->WEB服务器

1. 认识HTMl - 图2

WEB服务器->PC/手机端浏览器

1. 认识HTMl - 图3

HTMl初识

1. 认识HTMl - 图4
HTML语言结构

  • 页面结构（成对的标记包围页面内容）
  • 元素=开始标记+内容+结束标记
  • 所有页面要有<html>,<head>,<body>元素
  • 网页信息放在<head>
  • <body>将是浏览器看到的内容
  • 空白符（制表符，回车，空格）会被忽略，但可增加代码可读性

stlye元素

1. 认识HTMl - 图5

  • <style>放在html首部
  • 有开始标记也有结束标志
  • （可选项）属性type，由于要使用css，需要指定文件类型

1. 认识HTMl - 图6

CSS

  • HTMl（超文本标记语言），建立网页结构
  • CSS层叠样式表，控制HTML的表现
  • 增加网页的可读性和可用性
  • 可以在<style>中书写CSS规则，需要放在<head>元素中
  • 使用CSS在HTML中指定元素的特性

  • css的作用

1. 认识HTMl - 图7

  1. <html>
  2.     <head>
  3.         <title> 测试title </title>
  4.         <style type='text/css'>
  5.         body{
  6.         background-color:#353324;
  7.         margin-left:20%;
  8.         margin-right:20%;
  9.         border:2px dotted black;
  10.         padding:10px 10px 10px 10px;
  11.         font-family:sans-serif;
  12.         }
  13.         </style>
  14.     </head>
  15.     <body>
  16.          <h1>你好！</h1>
  17.          <p>这是测试代码</p>
  19.     </body>
  20. </html>