htmlcss基礎知識點有哪些

今天小編給大家分享一下html css基礎知識點有哪些的相關知識點,內容詳細,邏輯清晰,相信大部分人都還太了解這方面的知識,所以分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后有所收獲,下面我們一起來了解一下吧。

龍?zhí)毒W站建設公司創(chuàng)新互聯(lián)公司,龍?zhí)毒W站設計制作,有大型網站制作公司豐富經驗。已為龍?zhí)?000多家提供企業(yè)網站建設服務。企業(yè)網站搭建\外貿營銷網站建設要多少錢,請找那個售后服務好的龍?zhí)蹲鼍W站的公司定做!

HTML

網頁構成

摘要 說明
結構(HTML) HTML是網頁內容的載體。內容就是網頁制作者放在頁面上想要讓用戶瀏覽的信息,可以包含文字、圖片、視頻等。
表現(xiàn)(CSS) CSS樣式是表現(xiàn)。就像網頁的外衣。比如,標題字體、顏色變化,或為標題加入背景圖片、邊框等。所有這些用來改變內容外觀的東西稱之為表現(xiàn)。
行為(JavaScript / jQuery) JavaScript是用來實現(xiàn)網頁上的特效效果。如:鼠標滑過彈出下拉菜單。或鼠標滑過表格的背景顏色改變。還有購物網站中圖片的輪換??梢赃@么理解,有動畫的,有交互的一般都是用JavaScript來實現(xiàn)的

HTML文件結構

  • <html></html>為HTML頁面中的根標簽,所有的HTML網頁中的標簽都在<html></html>中。

  • 這里<head>標簽用于定義文檔的頭部,它是所有頭部元素的容器。頭部元素有<title>、<script><style>、<link>、 <meta>等標簽。

  • 在<body>和</body>標簽之間的內容是網頁的主要內容,如<h2>、<p>、<a>、<img>等網頁內容標簽,在這里的標簽中的內容會在瀏覽器中顯示出來。

標簽語法

  • 標簽由英文尖括號 < 和 > 括起來,如:<html>

  • html中的標簽一般都是成對出現(xiàn)的,分開始標簽和結束標簽。結束標簽比開始標簽多一個 / ,<title>..</title>;還有一些是自結束標簽,如:<br/>

  • 標簽與標簽之間是可以嵌套的,但先后順序必須保持一致,如:<div>里嵌套<p>,那么</p>必須放在</div>的前面。如: <div><p>..</p></div>

  • 注釋是不可以嵌套的,如:<!-- <!-- 注釋部分 --> -->

  • HTML標簽不區(qū)分大小寫,<h2>和<H1>是一樣的,但萬維網聯(lián)盟(W3C)建議小寫。

常用標簽

<h2>...</h2> 標題
<br /> 換行
<hr /> 分割線
<p>...</p> 段落
<span></span> 行內
<img src="" /> 圖片
<a href=""></a> 超鏈接
<ul>...</ul> 無序列表
<ol>...</ol> 有序列表
<li>...</li> 列表項
<table>...</table> 表格
<tr>...</tr> 一行
<td>...</td> 一列
<th>...</th> 列標題
<form>...</form> 表單
<input> 輸入框
<select>...</select> 下拉列表
<option>...</option> 下拉選項

屬性

align="left"                   【align="center",align="right"  左中右】

style="background-color: red"           【樣式】

<img alt="加載失敗提示" src="../網絡/本地路徑" border="邊框" width="100px" height="120" />【寬高只設置一項即可,另一項會自適應】

<a href="../網絡/本地路徑" target="_self">    【" target="_blank"在新窗口打開,默認原窗口打開】

列表

<ul type="square">
  <li>...</li>
  <li>...</li>
</ul>

在ul標簽中添加屬性 type="" circle 空心圓,disc 實心圓 (默認),square 實心方塊
在ol標簽中添加屬性 type="1/a/A/i/I"

表格

<table>
  <tr>        【行】
    <th></th>  【標題列】
  </tr>
  <tr>
    <td></td>  【列】
  </tr>
</table>

table標簽中可以聲明的屬性
  border=""    表格的邊框
  width=""      表格的寬度
  height=""     高度
  align=""       表格的對其方式
  bgcolor=""   背景顏色
td標簽內定義對齊方式的屬性
  align=""       設置當前單元格水平對齊
  valign=""     設置當前單元格垂直對齊
  bgcolor=""     設置背景顏色
合并單元格
     rowspan="    合并單元格的個數(shù)      合并行
  colspan="   合并單元格的個數(shù)    合并列

 表單

<form action="提交的路徑" method="get/post">

<input type="text" name="文本框" value="默認值"/>

<input type="password" name="密碼框" value="默認值"/>

<input type="radio" name="單選框" value="..." checked="默認選擇">

<input type="checkbox" name="復選框" value="..." checked="默認選擇">

<select name="下拉列表">
    <option value="china" selected="默認選擇">中國</option>
  </select>

<input type="hidden" name="隱藏域" value="..."> 

<input type="button"name="button" value="普通按鈕"> 

<input type="reset" value="重置按鈕">

<input type="submit"name="提交按鈕" value="...">

</form>

  • get:是將所有的提交的數(shù)據(jù)顯示在地址欄,長度會有一些限制

  • post:將要提交的數(shù)據(jù)放在請求體中,在url表單里面沒有任何數(shù)據(jù)

 提交時以key:value形式,其中文本框、密碼框的key為name 值為提交數(shù)據(jù)

             其中單選框、復選框、隱藏域、提交按鈕key為name 值為value

   下拉列表name在select標簽value在option標簽提交時同上key為name值為value

 常規(guī)屬性

id:  標簽的唯一編號,識別碼

class :   標簽的分類,用來識別一組標簽。

style:  標簽的風格、樣式

p,form,ol,ul,li,dl,dt,dd,h4{margin:0;padding:0;list-style:none} 樣式清除

事件屬性

  • onblur:          失去焦點

  • onclick:              鼠標點擊

  • onbdclick:          雙擊

  • onmouseover:   鼠標移動到元素上

CSS

CSS全稱為“層疊樣式表 (Cascading Style Sheets)”,它主要是用于定義HTML元素(或內容)在瀏覽器內的顯示樣式

語法

CSS樣式由選擇符(選擇器)和聲明組成,而聲明又由屬性和值組成

html css基礎知識點有哪些

語法說明

  • 屬性 (property) 是你希望改變的屬性,并且每個屬性都有一個值。屬性和值被冒號分開,并由花括號包圍,這樣就組成了一個完整的樣式聲明(declaration)

  • 多個聲明:如果要定義不止一個聲明,則需要用英文分號”;”將每個聲明分開。雖然最后一條聲明的最后可以不加分號,但盡量在每條聲明的末尾都加上分號

  • 每行最好只描述一個屬性

  • CSS對大小寫不敏感,但建議使用小寫。不過存在一個例外:class 和 id 名稱對大小寫是敏感的。

  • CSS注釋:/* 注釋內容 */

編寫位置

方式一:寫在標簽的style屬性中

<p style=“font-size:30px”>字體大小用px表示</p>

方式二:寫在html頭的style標簽中(style標簽一般寫在head標簽與title標簽之間)

<style type="text/css">
    p{
        background-color: yellow;
    }
</style>

方式三:寫在外部的css文件中,然后通過link標簽引入外部的css文件

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

優(yōu)先級按照上述講的三種方式依次降低

選擇器

標簽選擇器:標簽名        <html的標簽如:div>

id選擇器:#id(名)         <p id="屬性名">

類選擇器:.class(名)            <p class="屬性名">

組選擇器:選擇器1,&hellip;      【同時使用多個選擇器選中一組元素,使用,分隔】

派生選擇器:選擇器1 選擇器2 &hellip;  【根據(jù)上下文關系,選擇元素的后代元素,使用空格隔開】

常用樣式

顏色:color:red;或  #00F6DE

寬度:width:20px; 或  %20

高度:height:20px;  或  %20

背景顏色:background-color: #00F6DE

字體大?。篺ont-size:20px;

文本居中:text-align:center;

div居中:margin-left:auto;  margin-right:auto;

1px實線邊框:border:1px solid;

 列表去修飾:ul{list-style:none;}

以上就是“html css基礎知識點有哪些”這篇文章的所有內容,感謝各位的閱讀!相信大家閱讀完這篇文章都有很大的收獲,小編每天都會為大家更新不同的知識,如果還想學習更多的知識,請關注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

網站欄目:htmlcss基礎知識點有哪些
鏈接URL:http://muchs.cn/article48/ispohp.html

成都網站建設公司_創(chuàng)新互聯(lián),為您提供App設計、ChatGPT網站排名、自適應網站、商城網站、定制網站

廣告

聲明:本網站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)

網站優(yōu)化排名