আমি কীভাবে এইচটিএমএল লিঙ্কটিকে বোতামের মতো দেখতে পারি?

Question

আমি এএসপি.এনইটি ব্যবহার করছি, আমার কিছু বোতাম কেবল পুনর্নির্দেশগুলি করে। আমি বরং এটি সাধারণ লিঙ্ক ছিল, তবে আমি চাই না যে আমার ব্যবহারকারীরা উপস্থিতিতে খুব বেশি পার্থক্য লক্ষ্য করুন। আমি অ্যাঙ্করগুলি, অর্থাৎ ট্যাগগুলি মোড়ানো চিত্রগুলি বিবেচনা করেছি, তবে প্রতিবার আমি যখন কোনও বোতামের পাঠ্য পরিবর্তন করি তখন কোনও চিত্র সম্পাদককে সরিয়ে দিতে চাই না।

Comments

: প্রতিক্রিয়া আমি এই প্রশ্নের জন্য গৃহীত দেখুন stackoverflow.com/questions/547222/...

— tvanfosson

আপনি কয়েকটি দিক (রঙ, আকার, ফন্ট) কনফিগার করার পরে আপনার জন্য সিএসএস তৈরি করতে আপনি এই জাতীয় পরিষেবা ব্যবহার করতে পারেন ।

— তুলসী বাউর্ক

আমি জাভাস্ক্রিপ্ট দিয়ে এটি কীভাবে করব তার উত্তর দেব তবে প্রশ্নের কোনও "জাভাস্ক্রিপ্ট" ট্যাগ নেই

— ilyaigpetrov

@ ইলাইগপেট্রভ এগিয়ে যান এবং একটি উত্তর পোস্ট করুন। আমি এই প্রশ্নটি 7 বছর আগে জিজ্ঞাসা করেছি এবং দেখে মনে হচ্ছে এটি একটি সাধারণ সমস্যা এবং লোকেরা বিভিন্ন ধরণের সমাধানের প্রয়োজন হয়েছে।

— ম্যাথিউমার্টিন

Answer 1

এটি এই ক্লাস প্রয়োগ করুন

.button {
  font: bold 11px Arial;
  text-decoration: none;
  background-color: #EEEEEE;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
}

<a href="#" class="button">Example</a>

Comments

এটি ধরা পড়ার জন্য এটি আপনাকে সিএসএস সহ একটি বোতামের চেহারা পুনরুত্পাদন করা প্রয়োজন। তবে দুর্ভাগ্যক্রমে বিভিন্ন ব্রাউজারের ব্রাউজারগুলির বিভিন্ন সংস্করণ এবং ব্রাউজারগুলির বিভিন্ন সংস্করণ দেখতে আলাদা। সুতরাং আপনাকে কোনও ব্রাউজারে মজার লাগছে তা গ্রহণ করতে হবে, অথবা কোন ব্রাউজারটি ব্যবহার করবে এবং কোন সংস্করণ ব্যবহারকারীর রয়েছে এবং তা আলাদা স্টাইল বেছে নিতে কোডের একটি গুচ্ছ রাখতে হবে। যা পুরোপুরি সমস্যা, এবং পরের বার কোনও ব্রাউজারের নতুন সংস্করণ বের হয়ে আসতে পারে।

— জে

এটি কেবল তখনই কাজ করে যদি আমি এটি aসরাসরি ( a {display: block ...}) ট্যাগ করার জন্য প্রয়োগ করি , যা গ্রহণযোগ্য নয়। ট্যাগের classভিতরে থাকা অ্যাট্রিবিউটটি কেন aকাজ করবে না আপনার কোনও ধারণা আছে ? :( আমি ফায়ারফক্স ২ using ব্যবহার করছি। আমি চেষ্টাও করেছি a.button {...}এবং এটিও কাজ করে না

— just_a_girl

@ জা একটি আপস হতে পারে যে তারা <input type="submit">এবং / বা <button>উপাদানগুলির স্টাইলিং সংজ্ঞায়িত করতে পারে যাতে তারা ব্রাউজারের ডিফল্ট (যেখানে সম্ভব) ব্যবহার না করে এবং তারপরে .buttonউপরের মত স্টাইলিংয়ের সাথে এটি মেলে । এটি সম্পূর্ণরূপে অপসারণ না করে পার্থক্যগুলি হ্রাস করতে সহায়তা করা উচিত এবং এটি ব্রাউজারের ধরণ এবং সংস্করণকে স্নিগ্ধ করার পদ্ধতির চেয়ে আপনার (অবিশ্বস্ত - যেমন আপনি ঠিক বলেছেন) তুলনায় ভাল।

— অলি বনেট

@ অলিবেনেট ট্রু: আপনি কোনও বোতামের চেহারাটি পুরোপুরি নতুন করে সংজ্ঞায়িত করতে পারেন। আমি এটি করার চেষ্টা করিনি, শৈলীর কতগুলি দিক আপনাকে ওভাররাইড করতে হবে তা নিশ্চিত নয়। ব্যথার মতো শোনাচ্ছে, কিন্তু চেষ্টা করেও না, এটি অন্যান্য বিকল্পের সাথে তুলনা করে কত ব্যথা হয় তা বলতে পারছি না।

— জয়

@ ক্রেইগজিগারডেনজেন আমি .link_button এর জন্য আপনি যে স্টাইলগুলি ব্যবহার করেছেন তা আমি সত্যিই পছন্দ করি। CSS3 এর ব্যবহার অবশ্যই এই উত্তরটি আপডেট করে। "নিয়মিত" ব্রাউজার বোতামগুলির মতো কম স্টাইলগুলি ব্যবহার করা, তবে এখনও একটি বোতাম সাশ্রয় করা ব্রাউজার স্নিফিংয়ের সমস্যাটি সমাধান করে (ইমো) এর জন্য শৈলীর পুনরায় সংজ্ঞা না করিয়ে দেওয়ার জন্য<input type="submit">

— ইভান ডোনভান

Answer 2

কেন কেবল একটি বোতামের উপাদানটির চারপাশে একটি অ্যাঙ্কর ট্যাগটি মোড়ানো নয়।

<a href="somepage.html"><button type="button">Text of Some Page</button></a>

এটি IE9 +, ক্রোম, সাফারি, ফায়ারফক্স এবং সম্ভবত অপেরার জন্য কাজ করবে।

Comments

@ ডিয়ান_উইলসন অর্থাত্ for: ৯ এর জন্য খাওয়ার চেষ্টা করুন

— রোবটনিক

@ফিয়েল কারণ আমার কাছে ধারাবাহিকভাবে দেখার বোতামটি পাওয়া সহজ ছিল। আপনি যদি সিএসএস ব্যবহার করেন তবে এতে নেটিভ স্টাইলিং থাকবে না। অন্য কারও কাছে ইতিমধ্যে যাইহোক উত্তর ছিল।

— গুয়ানোম

আমি এই সমাধানটি পছন্দ করি, কারণ আপনাকে সিএসএসের সাথে নেটিভ ব্রাউজারের বোতামের স্টাইলটি অনুকরণ করার চেষ্টা করতে হবে না। যাইহোক, ফায়ারফক্সে আমি এটি কেবল সাথে কাজ করেছিলাম <button type="button">। প্রকারের বৈশিষ্ট্য ছাড়াই এটি সর্বদা একটি পোস্টব্যাক করবে এবং লিঙ্কটিকে উপেক্ষা করবে।

— টোবিয়াস

@ পাইটোচিতো আমি নিশ্চিত যেহেতু এটি ক্রোম এবং সাফারি ওয়েবকিটে রয়েছে। দেখে মনে হচ্ছে এটি jsfiddle.net/9Gt7y

— 18:52

<বাটন> এবং <a> নেস্টিং বৈধ এইচটিএমএল নয় এবং এর অপরিবর্তিত আচরণ রয়েছে। এখানে বিশদ উত্তর দেখুন stackoverflow.com/questions/6393827/… এটি যদি কাজ করে তবে এটি কেবল একটি কাকতালীয় ঘটনা।

— ওডিন

Answer 3

আইএমএইচও, আরও ভাল এবং আরও মার্জিত সমাধান রয়েছে। যদি আপনার লিঙ্কটি হয়:

<a href="http://www.example.com">Click me!!!</a>

সংশ্লিষ্ট বোতামটি এটি হওয়া উচিত:

<form method="GET" action="http://www.example.com">
<input type="submit" value="Click me!!!">
</form>

এই পদ্ধতির সহজ কারণ এটি সাধারণ এইচটিএমএল উপাদানগুলি ব্যবহার করে, তাই এটি কোনও ব্রাউজারে কোনও পরিবর্তন না করেই কাজ করবে । তদুপরি, আপনার যদি আপনার বোতামগুলির জন্য শৈলী থাকে তবে এই দ্রবণটি আপনার নতুন বোতামে বিনামূল্যে একই স্টাইলগুলি প্রয়োগ করবে।

Comments

ঠিক আছে, আমি আজ এটি পরীক্ষা করেছি .. এবং .. আপনি যদি এএসপি.এনইটি ওয়েবফর্ম ব্যবহার না করেন তবে এটি দুর্দান্ত কাজ করে। এএসপি.এনইটি ওয়েবফর্মগুলি পুরো পৃষ্ঠাকে একটি ফর্ম ট্যাগে আবৃত করে এবং নেস্টেড ফর্মগুলি মোটেও কাজ করে বলে মনে হচ্ছে না - এটি এএসপি.নেট ফর্ম ট্যাগের বাইরে কাজ করে, তবে এটি খুব উপরে এবং নীচে লিঙ্কগুলির ব্যবহারকে সীমাবদ্ধ করে।

— ম্যাথিউমার্টিন

সহজ এবং কার্যকর। আপনি প্রদর্শন যুক্ত করতে পারেন: ফর্ম উপাদানটিতে ইনলাইন শৈলী। অন্যথায় এটি একটি ব্লকের মতো চিকিত্সা করা হয় যা বোতাম / অ্যাঙ্কর / ইনপুট থেকে পৃথক।

— নিমরোডম

ভাল প্রশ্ন. আমিও তাই মনে করি না। তবে এখানে চিত্রিত অন্যান্য সমাধানগুলি গুগলবোটের সাথে কাজ করবে না, উদাহরণস্বরূপ বোতাম ট্যাগ ব্যবহার করার ক্ষেত্রে।

— রাউল লুনা

আমি এটি জ্যাঙ্গোতে চেষ্টা করেছিলাম, কিন্তু বোতামটি অন্য রূপের মধ্যে শেষ হওয়ার সাথে সাথে এটি লিঙ্ক হিসাবে অভিনয় করার চেয়ে ডেটা পোস্ট করে।

— wobbily_col 10

আপনি বোতামটি জাভাস্ক্রিপ্টে পুনর্নির্দেশ করতে পারবেন। নতুন ট্যাব ইত্যাদি খোলার জন্য মধ্যম ক্লিক না "ক্লিপবোর্ডে কপি লিংক ঠিকানা" করতে পারেন, মাউস ইত্যাদি সঙ্গে এটি উপর ঝুলে লিঙ্কে লক্ষ্য পূর্বরূপ - কিন্তু এখন এটি একটি লিঙ্ক নয়

— আলেকজান্ডার টেলর

Answer 4

CSS3 appearanceবৈশিষ্ট্য কোনও ব্রাউজারের অন্তর্নির্মিত শৈলীর সাথে কোনও উপাদান (অ্যাঙ্কর সহ) স্টাইল করার সহজ উপায় সরবরাহ করে <button>:

a.btn {
  -webkit-appearance: button;
  -moz-appearance: button;
  appearance: button;
}

<body>
  <a class="btn">CSS Button</a>
</body>

সিএসএস ট্রিকস এর আরও বিশদ সহ একটি সুন্দর রূপরেখা রয়েছে। মনে রাখবেন যে ইন্টারনেট এক্সপ্লোরারের কোনও সংস্করণ বর্তমানে caniuse.com অনুযায়ী এটি সমর্থন করে না ।

Comments

এটি CSS3 অনুমান থেকে বাদ দেওয়া হয়েছিল। এইচটিএমএলএডিএটি.এল.হেল্প.এফপি?

— m

Answer 5

a {
    display: block;
    height: 20px;
    width: auto;
    border: 1px solid #000;
}

আপনি <a>যদি তাদের কোনও ব্লক প্রদর্শন দেন তবে আপনি এই জাতীয় ট্যাগ নিয়ে খেলতে পারেন। আপনি প্রভাবটির মতো ছায়া দিতে এবং সেই বোতামটি অনুভব করার জন্য পটভূমির রঙ দিতে সীমানা সামঞ্জস্য করতে পারেন :)

Answer 6

আপনি যদি গোলাকার কোণগুলির সাথে সুন্দর বোতাম চান, তবে এই শ্রেণিটি ব্যবহার করুন:

.link_button {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: solid 1px #20538D;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    background: #4479BA;
    color: #FFF;
    padding: 8px 12px;
    text-decoration: none;
}

<a href="#" class="link_button">Example</a>

Comments

আমি এটি এবং জেএসফিডেলের সর্বোচ্চ র‌্যাঙ্কের উত্তর যুক্ত করেছি। Jsfiddle.net/5z6ew1m0/6 এর

— ক্রেগ জেরডিনজেন

আপনি একটি যুক্ত করতে পারেন margin । অন্যথায়, ভাল কাজ এটি স্টাইলিং।

— c00000fd

Answer 7

যেমনটি টিস্ট্যাম্পার বলেছেন, আপনি কেবল এটিতে সিএসএস বর্গ প্রয়োগ করতে পারেন এবং এটি সেভাবে ডিজাইন করতে পারেন। সিএসএসের ফলে লিঙ্কগুলির সাথে আপনি যেগুলি করতে পারেন তার সংখ্যা বৃদ্ধি পেয়েছে এবং এখন ডিজাইনের গোষ্ঠীগুলি কেবল থিমগুলির জন্য আশ্চর্যজনক-বর্ণিত সিএসএস বোতাম তৈরি করার দিকে মনোনিবেশ করে এবং আরও অনেক কিছু।

উদাহরণস্বরূপ, আপনি -webkit- রূপান্তর সম্পত্তি এবং pseduo- ক্লাস ব্যবহার করে ব্যাকগ্রাউন্ড-রঙের সাথে ট্রানজিশন করতে পারেন। এর মধ্যে কিছু ডিজাইন বেশ বাদাম পেতে পারে তবে এটি অতীতে যা করা উচিত ছিল তা বলার জন্য একটি দুর্দান্ত বিকল্প সরবরাহ করে, বলুন, ফ্ল্যাশ করুন।

উদাহরণস্বরূপ (এগুলি আমার মতে মন খারাপ করে), http://tympanus.net/De CreativeButtons/ (এটি উত্স পাতায় উত্স কোড সহ বোতামগুলির জন্য পুরোপুরি বাইরে অ্যানিমেশনগুলির একটি সিরিজ )। http://www.commentredirect.com/make-awesome-flat-buttons-css/ (একই লাইন বরাবর, এই বোতামগুলির সুন্দর তবে সংক্ষিপ্ত রূপান্তর প্রভাব রয়েছে এবং এগুলি নতুন "ফ্ল্যাট" ডিজাইনের স্টাইল ব্যবহার করে))

Answer 8

আপনি এটি জাভাস্ক্রিপ্ট দিয়ে করতে পারেন:

1. এর সাথে রিয়েল বোতামের সিএসএস স্টাইলগুলি পান getComputedStyle(realButton) ।
2. আপনার সমস্ত লিঙ্কে শৈলী প্রয়োগ করুন।

/* javascript, after body is loaded */
'use strict';

{ // Namespace starts (to avoid polluting root namespace).
  
  const btnCssText = window.getComputedStyle(
    document.querySelector('.used-for-btn-css-class')
  ).cssText;
  document.querySelectorAll('.btn').forEach(
    (btn) => {
      
      const _d = btn.style.display; // Hidden buttons should stay hidden.
      btn.style.cssText = btnCssText;
      btn.style.display = _d;
      
    }
  );
  
} // Namespace ends.

<body>
  <h3>Button Styled Links</h3>
  <button class="used-for-btn-css-class" style="display: none"></button>
  <a href="//github.io" class="btn">first</a>
  <a href="//github.io" class="btn">second</a>
  <button>real button</button>
  <script>/* You may put JS here. */</script>
</body>

Answer 9

আপনি একটি স্ট্যান্ডার্ড বোতাম তৈরি করতে পারেন, তারপরে এটি কোনও লিঙ্কের ব্যাকগ্রাউন্ড চিত্র হিসাবে ব্যবহার করুন। তারপরে আপনি চিত্রটি পরিবর্তন না করে লিঙ্কে পাঠ্য সেট করতে পারেন।

টিস্টস্ট্যাম্পার এবং এলাফর ওয়েজ দুটি ইতিমধ্যে প্রদত্ত দুটি বিশেষ রেন্ডার বোতাম না থাকলে সেরা সমাধানগুলি।

Answer 10

এটি সিএসএসের বিশদটিতে আরও কিছুটা আসে এবং আপনাকে কিছু চিত্র দেয়:

http://www.dynamicdrive.com/style/csslibrary/item/css_square_buttons/

Answer 11

অনেক বিলম্বিত উত্তর:

আমি যখন প্রথম এএসপিতে কাজ শুরু করি তখন থেকে আমি এ নিয়ে কুস্তি চালিয়ে যাচ্ছি। এখানে আমি সেরাটি নিয়ে এসেছি:

ধারণা: আমি একটি কাস্টম নিয়ন্ত্রণ তৈরি করেছি যার একটি ট্যাগ রয়েছে। তারপরে বোতামটিতে আমি একটি অনক্লিক ইভেন্ট রেখেছি যা জাভাস্ক্রিপ্টের সাহায্যে ডকুমেন্ট.লোকশনকে পছন্দসই মান হিসাবে সেট করে।

আমি কন্ট্রোল বাটনলিঙ্ককে ফোন করেছি, যাতে লিংক বাটনের সাথে বিভ্রান্ত হলে আমি সহজেই পেতে পারি।

aspx:

<%@ Control Language="VB" AutoEventWireup="false" CodeFile="ButtonLink.ascx.vb" Inherits="controls_ButtonLink" %>

<asp:Button runat="server" ID="button"/>

পিছনে কোড:

Partial Class controls_ButtonLink
Inherits System.Web.UI.UserControl

Dim _url As String
Dim _confirm As String

Public Property NavigateUrl As String
    Get
        Return _url
    End Get
    Set(value As String)
        _url = value
        BuildJs()
    End Set
End Property
Public Property confirm As String
    Get
        Return _confirm
    End Get
    Set(value As String)
        _confirm = value
        BuildJs()
    End Set
End Property
Public Property Text As String
    Get
        Return button.Text
    End Get
    Set(value As String)
        button.Text = value
    End Set
End Property
Public Property enabled As Boolean
    Get
        Return button.Enabled
    End Get
    Set(value As Boolean)
        button.Enabled = value
    End Set
End Property
Public Property CssClass As String
    Get
        Return button.CssClass
    End Get
    Set(value As String)
        button.CssClass = value
    End Set
End Property

Sub BuildJs()
    ' This is a little kludgey in that if the user gives a url and a confirm message, we'll build the onclick string twice.
    ' But it's not that big a deal.
    If String.IsNullOrEmpty(_url) Then
        button.OnClientClick = Nothing
    ElseIf String.IsNullOrEmpty(_confirm) Then
        button.OnClientClick = String.Format("document.location='{0}';return false;", ResolveClientUrl(_url))
    Else
        button.OnClientClick = String.Format("if (confirm('{0}')) {{document.location='{1}';}} return false;", _confirm, ResolveClientUrl(_url))
    End If
End Sub
End Class

এই স্কিমের সুবিধা: এটি নিয়ন্ত্রণের মতো দেখাচ্ছে। আপনি এটির জন্য একটি একক ট্যাগ লিখুন, <বাটনলিংক আইডি = "মাইবাটন" নেভিগেটরল = "ব্লহব্লাহ" />

ফলস্বরূপ বোতামটি একটি "আসল" এইচটিএমএল বোতাম এবং তাই দেখতে একটি বাস্তব বোতামের মতো দেখায়। আপনাকে সিএসএস সহ একটি বোতামের চেহারা অনুকরণ করার চেষ্টা করতে হবে না এবং তারপরে বিভিন্ন ব্রাউজারে বিভিন্ন বর্ণের সাথে লড়াই করতে হবে।

ক্ষমতাগুলি সীমাবদ্ধ থাকা সত্ত্বেও আপনি আরও সম্পত্তি যুক্ত করে সহজেই এটি প্রসারিত করতে পারেন। এটি সম্ভবত সম্ভব যে বেশিরভাগ বৈশিষ্ট্যগুলিকে কেবল পাঠ্য, সক্ষম এবং CSS এর ক্লাসের জন্য যেমন অন্তর্নিহিত বোতামটিতে "পাস" করতে হবে।

কারও যদি সহজ, ক্লিনার বা অন্যথায় ভাল সমাধান পাওয়া যায় তবে আমি এটি শুনে খুশি হব। এটি একটি ব্যথা, কিন্তু এটি কাজ করে।

Answer 12

এটিই আমি ব্যবহার করেছি। লিঙ্ক বোতামটি হ'ল

<div class="link-button"><a href="/">Example</a></div>

সিএসএস

/* body is sans-serif */ 

.link-button {
    margin-top:15px;
    max-width:90px;
    background-color:#eee;
    border-color:#888888;
    color:#333;
    display:inline-block;
    vertical-align:middle;
    text-align:center;
    text-decoration:none;
    align-items:flex-start;
    cursor:default;
    -webkit-appearence: push-button;
    border-style: solid;
    border-width: 1px;
    border-radius: 5px;
    font-size: 1em;
    font-family: inherit;
    border-color: #000;
    padding-left: 5px;
    padding-right: 5px;
    width: 100%;
    min-height: 30px;
}

.link-button a {
    margin-top:4px;
    display:inline-block;
    text-decoration:none;
    color:#333;
}

.link-button:hover {
    background-color:#888;
}

.link-button:active {
    background-color:#333;
}

.link-button:hover a, .link-button:active a {
    color:#fff;
}

Comments

এটি যদিও বোতামটির মতো দেখতে বেশি লাগে না। আমি জানি না কে আপনাকে কমেছে। আপনার প্রদত্ত কোডটির

— ম্যাথিউমার্টিন

Answer 13

এএসপি ব্যবহার সম্পর্কে কীভাবে: লিংক বাটন?

আপনি এটি করতে পারেন - আমি টিস্টাম্পারের এন্ট্রি ব্যবহার করে একটি লিঙ্কবটনটিকে একটি স্ট্যান্ডার্ড বোতামের মতো দেখিয়েছি। যদিও আমি text-decoration: noneসেটিংস সত্ত্বেও, আমি যখন লুকিয়ে ছিল তখন আন্ডারলাইনিং পাঠ্যের নীচে প্রদর্শিত হয়েছিল ।

style="text-decoration: none"লিঙ্কবুটনের মধ্যে যোগ করে আমি হোভার-আন্ডারলাইনিং বন্ধ করতে সক্ষম হয়েছি:

<asp:LinkButton 
id="btnUpdate" 
CssClass="btnStyleTStamper" 
style="text-decoration: none" 
Text="Update Items"   
Onclick="UpdateGrid"  
runat="server"
/>

Comments

লিংক বাটন এমন কিছু তৈরি করে যা দেখতে লিঙ্কের মতো লাগে তবে বোতামের মতো কাজ করে। বিপরীতে প্রশ্নটি জিজ্ঞাসা করে: এমন কিছু যা বোতামের মতো দেখায় তবে একটি লিঙ্কের মতো কাজ করে।

— জে

Answer 14

সীমানা, রঙ এবং পটভূমির রঙের বৈশিষ্ট্য ব্যবহার করে আপনি এইচটিএমএল লিঙ্কে একটি বোতাম তৈরি করতে পারেন!

a {
background-color: white;
color: black;
padding: 5px;
text-decoration: none;
border: 1px solid black;
}
a:hover {
background-color: black;
color: white;

}

<a href="https://stackoverflow.com/

">Open StackOverflow</a>

আশাকরি এটা সাহায্য করবে :]

Answer 15

এই ক্লাস ব্যবহার করুন । এটিতে যখন buttonক্লাসটি প্রয়োগ করা হয় তখন এটি আপনার লিঙ্কটিকে বোতামের মতো দেখায়a ট্যাগে ।

অথবা

এখানে অন্য ডেমো জেএসফিডল

.button {
    display: inline-block;
    outline: none;
    cursor: pointer;
    border: solid 1px #da7c0c;
    background: #478dad;
    text-align: center;
    text-decoration: none;
    font: 14px/100% Arial, Helvetica, sans-serif;
    padding: .5em 2em .55em;
    text-shadow: 0 1px 1px rgba(0,0,0,.3);
    -webkit-border-radius: .5em; 
    -moz-border-radius: .5em;
    border-radius: .3em;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.button:hover {
    background: #f47c20;
    background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
    background: -moz-linear-gradient(top,  #f88e11,  #f06015);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
}
.button:active {
    position: relative;
    top: 1px;
}

Answer 16

আমি একটি ব্যবহার asp:Button:

<asp:Button runat="server"
            OnClientClick="return location='targetPage', true;"
            UseSubmitBehavior="False"
            Text="Button Text Here"
/>

এইভাবে, বোতামটির ক্রিয়াটি সম্পূর্ণ ক্লায়েন্ট-সাইড এবং বোতামটি ঠিক একটি লিঙ্কের মতো কাজ করে targetPage।

Comments

asp:Buttonঅনুশীলনে দেখতে কেমন লাগে তা দেখানো ভাল কাজ , যাতে এটি অন্যান্য ব্যবহারকারীদের সহায়তা করতে পারে!

— যে ব্যবহারকারী 14

Answer 17

.button {
  font: bold 11px Arial;
  text-decoration: none;
  background-color: #EEEEEE;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
}

<a href="#" class="button">Example</a>

Answer 18

নীচে স্নিপেট ব্যবহার করুন।

    .a{
  color: $brn-acc-clr;
  background-color: transparent;
  border-color: #888888;

  &:hover:active{
    outline: none;
    color: #888888;
    border-color: #888888;
  }
  &:fill{
    background-color: #888888;
    color: #fff;
    box-shadow: 0 3px 10px rgba(#888888, 0.5);
    &:hover:active{
      color: #fff;
    }
    &:hover:not(:disabled){
      transform: translateY(-2px);
      background-color: darken(#888888, 4);
    }
  }
}

Answer 19

সিম্পল বাটন সিএসএস এখন আপনি আপনার এডিটরের সাথে খেলতে পারবেন

a {
  display: inline-block;
  background: #000000c9;
  color: #000;
  padding: 12px 24px;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
  cursor: pointer;
}
a:hover {
  background:#000
  cursor: pointer;
  transition: 0.3s ease-in;
}

লিঙ্ক ট্যাগ

<a href="#">Hover me<a>

Answer 20

এটি আমার পক্ষে কাজ করেছে। এটি দেখতে বোতামের মতো এবং কোনও লিঙ্কের মতো আচরণ করে। আপনি উদাহরণস্বরূপ এটি বুকমার্ক করতে পারেন।

<a href="mypage.aspx?param1=1" style="text-decoration:none;">
    <asp:Button PostBackUrl="mypage.aspx?param1=1" Text="my button-like link" runat="server" />
</a>

Answer 21

এএসপি ব্যবহার সম্পর্কে কীভাবে : লিংক বাটন ?

Comments

নাম সত্ত্বেও লিঙ্ক বোতামটি দেখতে কোনও লিঙ্কের মতো দেখাচ্ছে। w3schools.com/aspnet/showasp.asp?filename=demo_linkbutton

— ম্যাথিউমার্টিন