❶ 移動web 前端這種效果怎麼做
沒顯示出來是因為超出去了 你可以選擇
1 去掉overflow：hidden這樣會出現滾動條
2 縮小圖片
3 如果你那三個圖片是用div布局的你可以選擇讓那個圖片掉到第二行
4 縮小圖片間的間距，即調整margin padding
但是可能你會更喜歡第二，四種方法也算是不錯的方法
❷ 常見Web前端技術之間的關系，你了解多少
如果你是一個Web開發初學者，那麼你難免會在網上搜索HTML, CSS, XML, JS(Javascript), DOM, XSL等等這些詞的意思，然而，隨著學習的深入。當你把他們攪在一起，你又糊塗了，你會不停的問，HTML是什麼?CSS是什麼?XML是什麼?JS是什麼?它們到底有什麼用?無論是網路網路，還是一些IT專題網站，又或者一些牛人博客，他們都會告訴你，某個單一的東西是什麼，這類文章很多，但很少有涉及，它們組合起來是什麼，有什麼用。我想，我寫這篇文章，就是為了說明一下這個他們很少涉及的問題。
歸納、總結、提煉能力是我們進步的發動機，這種能力是可以有意識地培養的，拉卡拉電子支付公司董事長兼總裁孫陶然提到：在拉卡拉我們要求用三條說清楚任何問題就是一種能力訓練，任何問題如果不能用三條說清楚說明你還沒想透。
在這里，我爭取用最根本的語言向大家分別說明HTML, CSS, XML, JS到底是什麼，有什麼用。然後我們再來看把他們組合起來是什麼，有什麼用。當然如果你對HTML, CSS, XML, JS有足夠了解，可以直接跳過，看文章的後半部分，那裡才是本文核心所在。
第一部分
1. HTML超文本標記語言 (Hyper Text Markup Language) ，是用來描述網頁的一種標記語言。
<html>
<head>
<title>HTML</title>
</head>
<body>
<p id="num1">Hello World! I'm HTML</p>
</body> </html> 12345678
網頁文件本身是一種文本文件，通過在文本文件中添加標記，可以告訴瀏覽器如何顯示其中的內容(如：文字如何處理，畫面如何安排，圖片如何顯示等)。
HTML之所以稱為超文本標記語言，是因為文本中包含了所謂「超鏈接」點。超文本(Hypertext)是用超鏈接的方法，將各種不同空間的文字信息組織在一起的網狀文本。
概括，HTML就是整合網頁結構和內容顯示的一種語言。
Hello World! I'm HTML1
瀏覽器按順序閱讀網頁文件，然後根據標記符解釋和顯示其標記的內容。
這段內容在瀏覽器上顯示的結果是：Hello World! I』m HTML
我們看
標簽上有一個id，這是
這個標簽的唯一標識，方便別人找到它，對它進行操作。
2. CSS 層疊樣式表單(Cascading StyleSheet)。是將樣式信息與網頁內容分離的一種標記性語言 。作為網站開發者，你能夠為每個HTML元素定義樣式，並將之應用於你希望的任意多的頁面中。如需進行全局的更新，只需簡單地改變樣式，然後網站中的所有元素均會自動地更新。這樣，即設計人員能夠將更多的時間用在設計方面，而不是費力克服HTML的限制。說白了，CSS就是設置網頁上HTML元素屬性的語言。
CSS代碼：
#hello{
color:blue;
} 123
當把這段CSS代碼應用於HTML中，它會找到id為「hello」的HTML標簽，將其中的內容以藍色顯示出來;具體的插入HTML的方法這里不再贅述(說一句，只說明是什麼，有什麼用的問題，不關注技術細節，技術細節網上很好找)。
3. Javascript，首先說明JavaScript和Java無關，JavaScript 是屬於網路的腳本語言!那麼為什麼名字如此相似?這是典型的市場營銷方面的成功，它的推廣成功,也是借了Java的東風。當微軟開始意識到Javascript在Web開發人員中流行起來時，微軟還是一貫風格，建立了自己的腳本語言，JScript。
Javascript是一種基於對象(Object)和事件驅動(Event Driven)並具有安全性能的腳本語言。使用它的目的是與HTML超文本標記語言、Java腳本語言(Java小程序)一起實現在一個Web頁面中鏈接多個對象，與Web客戶交互作用。例如可以設置滑鼠懸停效果，在客戶端驗證表單，創建定製的HTML頁面，顯示警告框，設置cookie等等。
網頁中所有的對數據進行判斷、操作以及向瀏覽者反饋信息的本地代碼實現部分均是Javascript(當然也有其他的)，這樣既可以使網頁更具交互性，給用戶提供更令人興奮的體驗，同時減輕了伺服器負擔。
JS的代碼如下：
function jsHello(){
alert('Hello World！');
}123
當把以上代碼應用於HTML代碼，它會在你的HTML載入時，彈出一個內容為「Hello World!」的對話框。同樣，它是通過嵌入或調入在標準的HTML語言中實現的，至於如何嵌入或調入不再贅述，理由上面提到了。
4. Xml可擴展標記語言 (Extensible MarkupLanguage)，是一套定義語義標記的規則，這些標記將文檔分成許多部件並對這些部件加以標識。它也是元標記語言，即定義了用於定義其他與特定領域有關的、語義的、結構化的標記語言的句法語言。你可以把XML理解為一種資料庫，例如rss就是xml的一種變體。
XML代碼如下：
<Hello> <bcd>China</bcd> <bcd>USA</bcd> <bcd>UK</bcd> </Hello> 12345
XML的起因是，用戶受到SGML(後面再說)復雜性的挫傷和HTML的不充分。相對HTML來說，XML更追求嚴謹性，如果說你在HTML代碼中標簽比較混亂，如未關閉等，或許瀏覽器會忽略這些錯誤;但同樣的事情發生在XML中會給你帶來大麻煩。
鋪墊終於完了，在進入正題之前，建議大家對比著圖來理解後邊的內容，廢話不多說，開始進入正題。
第二部分
AJAX：非同步JavaScript和XML(AsynchronousJavaScript and XML)。
最後一個東東，它算得上是web2.0思想的心。AJAX=CSS+HTML+JS+XML+DOM+XSLT+XMLHTTP。是指一種創建互動式網頁應用的網頁開發技術。AJAX不是一種單一的新技術，而是有機地利用了一系列相關的技術。
在 2005年，Google 通過其 Google Suggest 使 AJAX 變得流行起來。
Google Suggest 使用 AJAX 創造出動態性極強的 web 界面：當您在谷歌的搜索框輸入關鍵字時，Javascript會把這些字元發送到伺服器，然後伺服器會返回一個搜索建議的列表。
在AJAX中，XmlHttp用來在不改變頁面的情況下傳輸數據，其中傳輸的數據即是XML，然後通過XSLT將其格式化，利用js通過dom對象將其顯示到HTML中，同時利用CSS確定數據的顯示及位置。
這項技術在網路上的應用無處不在，如你的微博，你的郵箱，你的QQ空間，再如搜索引擎，電子商務平台，網路地圖等等
❸ UI是怎麼和前端對接的
1.准確的來說，做ul的其實就做移動端設計的，設計一些移動端頁面，當然也包括ico圖標，手機上用的各種小圖標，logo等，比如一個小刪除按鈕。登錄按鈕，等。
2.而做前端的就是根據你的移動端ul界面來做成移動端手機頁面
❹ 前端工程師怎麼知道psd中各個位置的寬度和距離
這位網友你好，前端工程師一般都是用ps中的矩形選框工具，結合圖片的信息測量大小的，都是需要精確到1像素的。你說的快速測量各個模塊的大小和模塊間距只能用這種方法~
❺ 前端工程師，請問切圖是什麼意思我會寫div﹢css已經比較熟練了，js也、jquery這些也學完
是的，做前端必須必須會切圖，但是 切圖 就是PS裡面的一步操作，十分簡單。QQ截圖和PS切圖是動作不一樣，但是基本上是一樣的，QQ是截取，而PS裡面有個工具張的像 刀 ，拿著這個刀在圖上面畫，所以叫切圖。
選擇選中的切片，在點擊保存，就這么先切，在選擇，在保存，就完成了切圖，但是PS切圖比qq截圖用著爽多了，因為在PS裡面可以將圖片放大N倍，在切，在小的圖也能切，而且可以一次切很多，也能一次保存很多，所以比QQ截圖用著爽。總體來講比QQ截圖專業吧。
❻ js圖片無縫滾動的原理是什麼
以垂直滾動為例：一組圖片 控制它的滾動條進行滾動 且此時對這組圖片進行復制並添加進原圖片組中，現在就有兩組圖片了。你可以想像一下，現在滾動條繼續滾動，原來那組圖片最後一張圖片已經滾至頂端且消失，復制的那組圖片的第一張跟在原圖最後一張圖片後出現，此時你就能感覺到無縫滾動了，而就在此刻我們將滾動條高度設置為0（因為速度很快，所以不會出現停頓感），你感覺圖片就這樣一直不停的滾動下去了。關鍵點在於元素的復制、添加，以及滾動條距離的獲取和修改。網上代碼很多，都是基於這類構思
❼ css中如何設置兩個圖片之間的距離
1、css設置圖片距離可以用盒子模型的margin屬性。操作方法首先用html編輯器新建一個html文件，裡面放入幾張圖片：
❽ html中怎麼調整添加的圖片與文本之間的距離
html調整添加的圖片與文本之間的距離方法：
❾ 如何給兩個div之間設置一個間距html
設置兩個div之間的間距的方法：
先定義兩個div，div裡面分別有一段話。
這樣讓兩個div之間的間距擴大的問題就解決了。
(9)前端圖片之間的間距原理擴展閱讀：
div常用屬性
1.Height:設置DIV的高度；Width:設置DIV的寬度。
2.margin:用於設置DIV的外延邊距，也就是到父容器的距離。margin:後面跟有四個距離分別為到父容器的上-右-下-左邊的距離；margin: [top][right][bottom][left]
3.padding:用於設置DIV的內邊距（內如子元素與DIV邊界的距離）。padding:後面跟有四個距離分別為到父容器的上-右-下-左邊的距離；
4.border:設置DIV的邊框樣式；
5.background:設置DIV的背景樣式；background後可直接跟背景的顏色、背景圖片、平鋪方式等樣式。
6.position:設置DIV的定位方式。position的屬性中有static、fixed、relative、absolute四個屬性。常用relative和absolute。
7.display:設置顯示屬性。其值有block、none；
8.float:設置DIV在頁面上的流向，其值有left(靠左顯示)、right(靠右顯示)、none；
❿ HTML 圖片和圖片間距用什麼代碼
代碼如下：
<div class="f0">
<img src="images/1.png" >
<img src="images/2.png" >
<img src="images/3.png" >
</div>
這個是瀏覽器的一個設計問題。img本來是行內元素，卻可以用width 和height,當父元素沒有設置高度的時候，用子元素們的高度計算出的高度給父元素的時候就會出現3px空隙這類的問題。img圖片默認排版為 inline-block;而所有的inline-block元素之間都會有空白。
(10)前端圖片之間的間距原理擴展閱讀
在CSS中通過line-height屬性來實現行間距的設置，line-height的值表示的是兩行文字之間基線的距離。文字的基線，指的是如果給文字加上下劃線，那麼上下劃線就是文字的基線。
Line-height的值設置為具體的數值，可以是相對數值，也可以設置為絕對數值，在靜態頁面中，文字大小固定時常常使用絕對數值，而對於論壇和博客這些用戶可以自定義字體大小的頁面，通常設置為相對數值，從而，可以隨著用戶自定義的字體大小改變相應的行間距。
CSS中通過letter-spacing屬性來調整字間距，這個屬性同樣可以設置相對數值和絕對數值。