Silencejql
0%

Web入门

发表于 更新于 Valine：
本文字数： 938 阅读时长 ≈ 1 分钟

Web入门笔记

HTML

HTML: Hyper Text Markup Language-超文本标记语言

HTML元素

1
<p class="editor-note">Hello HTML</p>

元素由 开始标签, 内容, 结束标签 组成
元素可以有属性, 属性包含了元素的额外信息且不显示在内容中.

常见元素

图像

<img src="images/img.png" alt="Image" />

段落

<p>这是一个段落</p>

列表

列表分为有序列表(Ordered List)\


    无序列表(Unordered List)\

      列表中项目(List Item)\

    • 链接

      链接用\(Anchor)表示
      `      xxx官网`

      CSS

      CSS: Cascading Style Sheets-层叠样式表
      CSS用于给HTML元素添加样式

      在HTML中用link元素引入

      <link href="styles/style.css" rel="stylesheet" />

      规则集

      1
      2
      3
      4
      5
      6
      li,
      h1,
      p{
          color: red;
          width: 500px;
      }

      选择器(Selector)

      HTML元素的名称位于规则集的开始

      声明(Declaration)

      一个单独的规则, 如color: red

      属性(Properties)

      改变样式的方法, 如color

      属性值(Properties Value)

      指定声明中属性的值

      div

      CSS布局主要是基于Div

      padding

      内边距: div盒子中内容到border的空间

      border

      边框: div盒子中有效区域边框线条

      margin

      外边距: div盒子中border到最外围的空间

      JavaScript

      为网站添加交互功能

      在HTML中用script引入
      <script src="scripts/main.js" defer></script>

      1
      2
      let myHeading = document.querySelector("h1");
      myHeading.textContent = "Hello world!";