এইচটিএমএল -এ কিভাবে একটি অনুভূমিক রেখা যোগ করা যায়

লেখক: Virginia Floyd
সৃষ্টির তারিখ: 14 আগস্ট 2021
আপডেটের তারিখ: 1 জুলাই 2024
Anonim
কিভাবে HTML-এ অনুভূমিক লাইন যোগ করবেন - html কোডিং অনুভূমিক লাইন | HTML টিউটোরিয়াল ট্যাগ| লেকচার 4
ভিডিও: কিভাবে HTML-এ অনুভূমিক লাইন যোগ করবেন - html কোডিং অনুভূমিক লাইন | HTML টিউটোরিয়াল ট্যাগ| লেকচার 4

কন্টেন্ট

এই নিবন্ধটি আপনাকে দেখাবে কিভাবে এইচটিএমএলে একটি অনুভূমিক রেখা যোগ করা যায়। অনুভূমিক রেখাটি সাইটে বিষয়বস্তু আলাদা করতে ব্যবহার করা যেতে পারে। লাইন তৈরির কোডটি বেশ সহজ। যাইহোক, এইচটিএমএল 4.01 এ, অভ্যন্তরীণ কমান্ড ব্যবহার করে একটি লাইনের নকশা পরিবর্তন করা সম্ভব। এইচটিএমএল 5 -তে, লাইন স্টাইল করার জন্য আপনাকে সিএসএস ব্যবহার করতে হবে।

ধাপ

2 এর পদ্ধতি 1: এইচটিএমএল 4.01 এ কাজ করা

  1. 1 একটি বিদ্যমান খুলুন অথবা একটি নতুন HTML নথি তৈরি করুন। এইচটিএমএল ডকুমেন্টগুলি নোটপ্যাডের মতো টেক্সট এডিটর বা অ্যাডোব ড্রিমওয়েভারের মতো একটি বিশেষ কোড এডিটর দিয়ে সম্পাদনা করা যেতে পারে। আপনার পছন্দের প্রোগ্রামে একটি HTML ডকুমেন্ট খোলার জন্য এই পদক্ষেপগুলি অনুসরণ করুন:
    • নোটপ্যাড বা অন্য টেক্সট / কোড এডিটর খুলুন।
    • মেনু খুলুন ফাইল.
    • ক্লিক করুন খোলা.
    • HTML ফাইল নির্বাচন করুন।
    • ক্লিক করুন খোলা
  2. 2 আপনি যেখানে লাইনটি সন্নিবেশ করতে চান সেই স্থানটি নির্বাচন করুন। যতক্ষণ পর্যন্ত লাইনটি প্রদর্শিত হবে তার উপরের লাইনটি না পাওয়া পর্যন্ত নিচে স্ক্রোল করুন এবং তারপরে সেই লাইনের একেবারে বাম দিকে ক্লিক করে কার্সারটিকে সরাসরি সেই লাইনের শুরুতে নিয়ে যান।
  3. 3 একটি খালি লাইন যোগ করুন। ডবল ট্যাপ লিখুনআপনি একটি লাইন সন্নিবেশ করতে চান তার আগে পাঠ্যটি সরানোর জন্য, এবং তারপর একটি ফাঁকা লাইনে কার্সার রাখুন।
  4. 4 Hr> ট্যাগ যোগ করুন। প্রবেশ করুন hr> লাইনের শুরুতে ফাঁকা জায়গায়। ট্যাগ hr> আপনাকে পুরো পৃষ্ঠা জুড়ে একটি অনুভূমিক রেখা আঁকতে দেয়।
  5. 5 "Hr" ট্যাগের পরে কার্সারটি টিপে একটি নতুন লাইনে সরান লিখুন. এখন ট্যাগ hr> একটি পৃথক লাইনে থাকা উচিত।
  6. 6 অনুভূমিক রেখায় বৈশিষ্ট্য যুক্ত করুন (alচ্ছিক)। দৈর্ঘ্য, বেধ, রঙ এবং সারিবদ্ধকরণের মতো বৈশিষ্ট্য যুক্ত করুন। "Hr" এর পরপরই এগুলিকে কোঁকড়া ধনুর্বন্ধনীতে আবদ্ধ করুন। একাধিক গুণাবলী যোগ করতে, সেগুলিকে একটি স্পেস দিয়ে আলাদা করুন।
    • প্রবেশ করুন hr size = "#">লাইনের বেধ পরিবর্তন করতে। একটি সংখ্যাসূচক পুরুত্বের মান দিয়ে "#" প্রতিস্থাপন করুন (উদাহরণস্বরূপ, আকার = "10")।
    • প্রবেশ করুন ঘন্টা প্রস্থ = "#">লাইনের প্রস্থ পরিবর্তন করতে। পিক্সেলের সংখ্যা বা পৃষ্ঠার প্রস্থের শতাংশের সাথে "#" প্রতিস্থাপন করুন (উদাহরণস্বরূপ, প্রস্থ = "200" বা প্রস্থ = "75%")।
    • প্রবেশ করুন hr color = "#">লাইনের রঙ পরিবর্তন করতে। রঙের নাম বা তার হেক্সাডেসিমাল কোডের সাথে "#" প্রতিস্থাপন করুন (উদাহরণস্বরূপ, রঙ = "লাল" বা রঙ = "# FF0000")।
    • প্রবেশ করুন hr align = "#">লাইন সারিবদ্ধ করতে। "#" এর পরিবর্তে "ডান" (ডান), "বাম" (বাম), অথবা "কেন্দ্র" (কেন্দ্র) (উদাহরণস্বরূপ, hr width = "50%" align = "center">).
  7. 7 HTML ফাইল সেভ করুন। একটি HTML ফাইল হিসাবে একটি টেক্সট ফাইল সংরক্ষণ করতে, আপনাকে অবশ্যই ফাইল এক্সটেনশন (.txt, .docx) পরিবর্তন করে ".html" করতে হবে। আপনার HTML ডকুমেন্ট সংরক্ষণ করতে এই ধাপগুলি অনুসরণ করুন:
    • মেনু খুলুন ফাইল.
    • ক্লিক করুন সংরক্ষণ করুন.
    • ফাইলের নাম ক্ষেত্রে ফাইলের জন্য একটি নাম লিখুন।
    • যোগ করুন .html ফাইলের নামের পরে।
    • ক্লিক করুন সংরক্ষণ.
  8. 8 আপনার HTML ডকুমেন্ট চেক করুন। এইচটিএমএল ফাইলটি পরীক্ষা করতে, এটিতে ডান ক্লিক করুন এবং ওপেন উইথ নির্বাচন করুন। তারপর আপনার ওয়েব ব্রাউজার নির্বাচন করুন। যেখানে আপনি "hr" ট্যাগ insুকিয়েছেন সেখানে একটি কঠিন লাইন উপস্থিত হওয়া উচিত। এইচটিএমএল কোড এরকম কিছু দেখাবে:

      ! < / P1> / body> / html>

2 এর পদ্ধতি 2: CSS / HTML5 এ কাজ করা

  1. 1 একটি বিদ্যমান খুলুন অথবা একটি নতুন HTML নথি তৈরি করুন। এইচটিএমএল ডকুমেন্টগুলি নোটপ্যাডের মতো একটি টেক্সট এডিটর বা অ্যাডোব ড্রিমওয়েভারের মতো একটি বিশেষ কোড এডিটর দিয়ে সম্পাদনা করা যেতে পারে। আপনার পছন্দের প্রোগ্রামে একটি HTML ডকুমেন্ট খোলার জন্য এই পদক্ষেপগুলি অনুসরণ করুন:
    • নোটপ্যাড বা অন্য টেক্সট / কোড এডিটর খুলুন।
    • মেনু খুলুন ফাইল.
    • ক্লিক করুন খোলা.
    • HTML ফাইল নির্বাচন করুন।
    • ক্লিক করুন খোলা
  2. 2 আপনার HTML ডকুমেন্টে একটি শিরোনাম যোগ করুন। যদি আপনার এইচটিএমএল ডকুমেন্টে ইতিমধ্যেই শিরোনাম না থাকে, তাহলে একটি যোগ করার জন্য এই ধাপগুলি অনুসরণ করুন। শিরোনামটি অবশ্যই html> tag এবং body> tag এর আগে যেতে হবে।
    • প্রবেশ করুন মাথা> নথির শীর্ষে।
    • ডবল ট্যাপ লিখুনদুটি নতুন লাইন যোগ করতে।
    • প্রবেশ করুন / মাথা>শিরোনাম বন্ধ করতে।
  3. 3 প্রবেশ করুন style type = "text / css"> হেডারের ভিতরে। শিরোনাম ট্যাগ দুটি শিরোনাম ট্যাগের মধ্যে স্থাপন করা হয় যাতে আপনি এমন একটি জায়গা তৈরি করতে পারেন যেখানে আপনি HTML ডিজাইন পরিবর্তন করতে CSS ব্যবহার করতে পারেন।
    • বিকল্পভাবে, আপনি একটি বহিরাগত শৈলী শীট ব্যবহার করতে পারেন। লেখাটি পড়ুন "কিভাবে একটি CSS ফাইল HTML এ োকাবেনLearn কিভাবে একটি বহিরাগত CSS ফাইলকে একটি HTML ফাইলের সাথে লিঙ্ক করতে হয় তা শিখতে।
  4. 4 প্রবেশ করুন ঘন্টা {. অনুভূমিক রেখাকে স্টাইল করার জন্য এটি CSS ট্যাগ। আপনার শিরোনাম বা বাহ্যিক CSS ফাইলে "স্টাইল" ট্যাগের পরে এটি যুক্ত করুন।
  5. 5 Hr> ট্যাগের জন্য CSS স্টাইল যুক্ত করুন। তাদের অবশ্যই "hr {" ট্যাগের পরে আসতে হবে। একটি অনুভূমিক রেখা বিভিন্ন উপায়ে স্টাইল করা যায়। নীচে তাদের কয়েকটি।
    • প্রবেশ করুন প্রস্থ: ## px;লাইনের প্রস্থ সামঞ্জস্য করতে। পিক্সেলে লাইন প্রস্থ দিয়ে "##" প্রতিস্থাপন করুন। পিক্সেল (px) এর পরিবর্তে, আপনি একটি শতাংশ (%) ব্যবহার করতে পারেন।
    • প্রবেশ করুন উচ্চতা: ## px;লাইন ওজন সামঞ্জস্য করতে। পিক্সেলে লাইন প্রস্থ দিয়ে "##" প্রতিস্থাপন করুন।
    • প্রবেশ করুন পেছনের রঙ: ##;লাইন রঙ নির্দিষ্ট করতে। একটি রঙের নাম বা হ্যাশ (#) এর পরে "##" এর পরিবর্তে একটি হেক্সাডেসিমাল রঙ কোড লিখুন।
    • প্রবেশ করুন মার্জিন-ডান: ## px;ডান প্রান্ত থেকে পিক্সেলের সংখ্যা নির্দিষ্ট করতে। একটি সংখ্যাসূচক পিক্সেল বা "অটো" কোড দিয়ে "##" প্রতিস্থাপন করুন। বাম বা কেন্দ্রে লাইন সারিবদ্ধ করতে "অটো" লিখুন।
    • প্রবেশ করুন মার্জিন-বাম: ## px;বাম প্রান্ত থেকে পিক্সেলের সংখ্যা নির্দিষ্ট করতে। একটি সংখ্যাসূচক পিক্সেল বা "অটো" কোড দিয়ে "##" প্রতিস্থাপন করুন। ডান বা কেন্দ্রে লাইন সারিবদ্ধ করতে "অটো" লিখুন।
    • প্রবেশ করুন মার্জিন-টপ: ## px; লাইনের জন্য উপরের প্যাডিং নির্দিষ্ট করতে। "##" পিক্সেলের প্যাডিং এর সাথে সংশ্লিষ্ট একটি সংখ্যা দিয়ে প্রতিস্থাপন করুন।
    • প্রবেশ করুন মার্জিন-বটম: ## px;লাইনের জন্য নিচের প্যাডিং নির্দিষ্ট করতে। "##" পিক্সেলের প্যাডিং এর সাথে সংশ্লিষ্ট একটি সংখ্যা দিয়ে প্রতিস্থাপন করুন।
    • প্রবেশ করুন সীমানা-প্রস্থ: ## px;লাইনের চারপাশে একটি বাক্স আঁকতে (alচ্ছিক)। সীমানার প্রস্থের সাথে সংশ্লিষ্ট একটি সংখ্যা দিয়ে "##" পিক্সেলে প্রতিস্থাপন করুন।
    • প্রবেশ করুন সীমান্ত রঙ: ##;সীমানার রঙ নির্দিষ্ট করতে (alচ্ছিক)। একটি রঙের নাম বা হ্যাশ (#) এর পরে "##" এর পরিবর্তে একটি হেক্সাডেসিমেল রঙ কোড লিখুন।
  6. 6 প্রবেশ করুন } hr> ট্যাগের জন্য স্টাইলিং সম্পূর্ণ করার জন্য স্টাইল অ্যাট্রিবিউটের পরে।
  7. 7 প্রবেশ করুন hr> এইচটিএমএল ডকুমেন্টের মূল অংশে একটি অনুভূমিক রেখা যুক্ত করতে। যখনই আপনি আপনার HTML ডকুমেন্টে hr> ট্যাগ ব্যবহার করবেন CSS স্টাইল সেটিংস প্রয়োগ করা হবে। আপনার কোড এরকম কিছু দেখতে হবে:

      ! DOCTYPE html> html> head> style type = "text / css"> hr {width: 50%; উচ্চতা: 20px; পটভূমি রঙ: লাল; মার্জিন-ডান: অটো; মার্জিন-বাম: স্বয়ংক্রিয়; মার্জিন-শীর্ষ: 5px; মার্জিন-বটম: 5px; সীমানা-প্রস্থ: 2px; সীমানা-রঙ: সবুজ; < / style> / head> body> h1> Heading / h1> hr> p1> এই লাইনটি একটি অনুভূমিক রেখা দ্বারা শিরোনাম থেকে আলাদা করা উচিত / p1> / body> / html>