400-650-7353
您所在的位置:首頁 > IT干貨資料 > web前端 > 【Web前端基礎知識】CSS定位如何使用

【Web前端基礎知識】CSS定位如何使用

  • 發布: Web前端培訓
  • 來源:Web前端干貨資料
  • 2020-04-08 15:26:40
  • 閱讀()
  • 分享
  • 手機端入口

在前端頁面開發中,要實現復雜頁面的布局,必須根據不同的設計尋求不同的CSS定位機制。CSS有三種基本定位機制:標準流,浮動,定位,今天小編先給大家介紹一下定位。

定位(position)

顧名思義,你想定哪就定哪;

元素的定位屬性主要包括兩部分:定位模式和邊偏移

(1)定位模式

定位的語法:position:屬性值;

position屬性常用的值

static自動定位(默認定位方式)

relative相對定位,相對于其原文檔流的位置進行定位

absolute絕對定位,相對于其上一個已經定位的父元素進行定位

fixed固定定位,相對于瀏覽器窗口進行定位

1)靜態定位(static)

文檔流中的默認位置,標準流特性。

取消定位會用到:position: static;

HTML

CSS

不能使用偏移屬性。

2)相對定位(relative)

相對定位是將元素相對于它在標準流中的位置進行定位,當position屬性的取值為relative時,可以將元素定位于相對位置。

HTML

CSS

瀏覽器

對元素設置相對定位后,可以通過邊偏移屬性改變元素的位置,但是它在文檔流中的位置仍然保留,不脫標。

CSS

瀏覽器

相對定位的元素不轉行內塊

文章“【Web前端基礎知識】CSS定位如何使用”已幫助

>>本文地址:http://www.028benet.com/zhuanye/2020/48593.html

THE END  

聲明:本站稿件版權均屬中公教育優就業所有,未經許可不得擅自轉載。

1 您的年齡

2 您的學歷

3 您更想做哪個方向的工作?

獲取測試結果
  • 大前端大前端
  • 大數據大數據
  • 互聯網營銷互聯網營銷
  • JavaJava
  • Linux云計算Linux
  • Python+人工智能Python
  • 嵌入式物聯網嵌入式
  • 全域電商運營全域電商運營
  • 軟件測試軟件測試
  • 室內設計室內設計
  • 平面設計平面設計
  • 電商設計電商設計
  • 網頁設計網頁設計
  • 全鏈路UI/UE設計UI設計
  • VR/AR游戲開發VR/AR
  • 網絡安全網絡安全
  • 新媒體與短視頻運營新媒體
  • 直播帶貨直播帶貨
  • 智能機器人軟件開發智能機器人
 

快速通道fast track

近期開班時間TIME

主站蜘蛛池模板: 亚洲美女一区二区三区| 国产精品欧美亚洲韩国日本| 国产av永久精品无码| 久久久久国产免费| 青娱乐在线免费视频| 日韩在线天堂免费观看| 国产成人精品一区二区三区免费| 亚洲av一本岛在线播放| 日本h在线精品免费观看| 欧美aaaa在线观看视频免费| 国产精品久久现线拍久青草| 亚洲人成电影在线观看青青| 2021国产精品一区二区在线| 欧美激情一区二区三区在线 | 久久综合久久鬼| 麻豆国产精品一二三在线观看| 日韩中文字幕在线免费观看| 国产偷国产偷亚洲高清日韩| 中文字幕在线视频免费观看| 精品欧美一区二区三区久久久| 好男人在线社区www我在线观看 | 黄网站色视频免费看无下截| 日韩免费视频一区二区| 国产不卡一卡2卡三卡4卡5卡在线| 中文精品久久久久国产网站| 精品无码久久久久国产| 天天躁日日躁狠狠躁av麻豆| 亚洲爱情岛论坛| 亚洲精品456| 日本精品久久久久护士| 可知子与野鸟君日文| h片在线观看免费| 欧美精品免费观看二区| 国产欧美日韩亚洲一区二区三区 | 美女大量吞精在线观看456| 尤物精品视频一区二区三区| 亚洲黄色在线看| xxx毛茸茸的亚洲| 日日碰狠狠添天天爽超碰97| 午夜成人理论福利片| 99久久99久久免费精品小说|