頁:
[1]
求助HTML 語法2
想請教一下
(1)項目符號<ul>執行時會空ㄧ行嗎?
(2)我如果不希望材料和做法 與下面的項目間沒有空行,我要怎麼處理
(3)還有用<div>和<section>感覺沒有甚麼差別
(4)在這邊我有加article好像多此一舉?有加跟沒有加我試了一下好像只是標題的字變大而已,那這個的用途在哪裡?
程式如下
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>實作題 CH3-2</title>
<style>
.note{color:red}
</style>
</head>
<body>
<article>
<hgroup>
<span class="note"><h1><u>苦瓜的健康料理 — 苦瓜鑲肉</u></h1></span>
</hgroup>
<section>
<p>苦瓜又稱為錦荔枝,因為「實大如鴿子,有皺紋,似荔枝」而得名。</p>
<blockquote>
<dt><ul type="disc"><li>材料</li></ul></dt>
<dd>
<ol type="a" start="1">
<li>苦瓜</li>
<li>大白菜</li>
<li>豬肉絞肉</li>
<li>太白粉</li>
<li>鹽</li>
<li>苦瓜</li>
</ol>
</dd>
</blockquote>
<blockquote>
<dt><ul type="disc"><li>作法</li></ul></dt>
<dd>
<ol type="1" start="1">
<li>苦瓜橫切成數塊,然後將內膜和子去除乾淨,使其成中空圈狀。</li>
<li>鹽漬數分鐘去除苦味。</li>
<li>將豬肉鑲進中空圈狀的苦瓜,然後沾少許太白粉水,使其黏固。</li>
<li>用油煎熟,然後加入大白菜及少許水悶煮數分鐘即可。</li>
</ol>
</dd>
</blockquote>
</section>
</article>
</body>
</html>
...<div class='locked'><em>瀏覽完整內容,請先 <a href='member.php?mod=register'>註冊</a> 或 <a href='javascript:;' onclick="lsSubmit()">登入會員</a></em></div><div></div> 在網頁大部分的樣式我們都用css來控制, 也就是<style>裡面的部分
各種tag如果你沒有自定義css, 瀏覽器本身會給他一些默認的
你可以打開瀏覽器的開發者模式(F12)去觀察他的默認樣式, 不過每個瀏覽器的樣式可能會不同. theloserbm 發表於 2017-6-1 04:52 PM static/image/common/back.gif
在網頁大部分的樣式我們都用css來控制, 也就是裡面的部分
各種tag如果你沒有自定義css, 瀏覽器本身會給他 ...
意思是
不是因為我程式用法出問題
而是我缺少其他程式的輔助
造成多空一行的結果?
因為我是自己練習範例
所以應該沒太大問題?
謝謝指導了...<div class='locked'><em>瀏覽完整內容,請先 <a href='member.php?mod=register'>註冊</a> 或 <a href='javascript:;' onclick="lsSubmit()">登入會員</a></em></div> dinofree0618 發表於 2017-6-1 05:18 PM static/image/common/back.gif
意思是
不是因為我程式用法出問題
而是我缺少其他程式的輔助
也...不算是其他程式吧
HTML+CSS+JS本來就是息息相關的
兩個ul之間和ol/ul之間默認空行我是可以接受的, 畢竟屬於兩個不同的list, 空一行比較正常吧
你需要的效果不是這種默認效果的話, 與其去改HTML, 不如改CSS來達成目標
例如你的標題h1不要bold, 不一定要把h1改成div, 去改h1的CSS也是可以的h1 {
font-weight: normal;
}...<div class='locked'><em>瀏覽完整內容,請先 <a href='member.php?mod=register'>註冊</a> 或 <a href='javascript:;' onclick="lsSubmit()">登入會員</a></em></div> theloserbm 發表於 2017-6-2 12:00 PM static/image/common/back.gif
也...不算是其他程式吧
HTML+CSS+JS本來就是息息相關的
了解
謝謝指導
那等我學完HTML之後
往CSS邁進時會更能體會吧!<br><br><br><br><br><div></div> 以下小弟拙見,希望對您有幫助:
1.您目前學習是前台網站最基本架構HTML,也就是讓瀏覽器可以順利顯示出內容(CONTENT),所以您使用到的各個TAG(例:HTML, HEAD, META, BODY, DIV..等)都會依HTML有定義的方式進一步呈現至瀏覽器中。舉些例子來說,DIV TAG將呈現無線條、無底色的方塊型式以讓文字可顯示、UL+LI TAG則是呈現條列式方塊(含縮排)來呈現…等(詳細的各HTML TAG功能及樣式可參考各書本或請教GOOGLE..)。
2.theloserbm大大所提醒您的「CSS」語法是為了強化HTML語法欠缺的多種類樣式呈現所需要的語法(如:我想把某一段文字的底色用成浮色印、指定某個文字變粗或加上方框/虛線...等)。
綜合上面所述基本精神,您的問題可做以下解答:
(1)項目符號<ul>執行時會空ㄧ行嗎?
ANS : 其實它不是空一行,是基本HTML語法讓它們之間的距離比較大,因為原始的UL就是要呈現條列式重點的原意。
(2)我如果不希望材料和做法 與下面的項目間沒有空行,我要怎麼處理
ANS : 此問題需要「theloserbm大大」告訴您的答案 - 請使用CSS語法來修飾或強制變小UL、LI之間的間距,可試著用padding, margin的CSS語法進一步改善頁面顯示。
(3)還有用<div>和<section>感覺沒有甚麼差別
ANS : 瀏覽器的HTML基本語法是把<section>當成一般文章的內文進行顯示。
(4)在這邊我有加article好像多此一舉?有加跟沒有加我試了一下好像只是標題的字變大而已,那這個的用途在哪裡?
ANS : 瀏覽器的HTML基本語法是把<article>當成一般文章的標題進行顯示,所以它預設顯示較大的文字。
以上觀念跟您分享,希望對您有幫助。...<div class='locked'><em>瀏覽完整內容,請先 <a href='member.php?mod=register'>註冊</a> 或 <a href='javascript:;' onclick="lsSubmit()">登入會員</a></em></div> (1)跟(2)不空一行很簡單
請設定CSS
<style>
dd ul li {float: left; /*靠左就不會斷行了*/
padding-left:10px /* 避免靠左黏太擠左邊設一下填充*/
}
</style>
影溪 發表於 2017-6-23 02:02 AM static/image/common/back.gif
(1)跟(2)不空一行很簡單
請設定CSS
了解
我會去慢慢研究CSS
謝謝說明與指導
頁:
[1]